未知の理由があるため、iPad Safariには本当に長い背景イメージが表示されません。 my exampleでは、背景画像は1,000 x 10,000ピクセルです。同じ例はどのデスクトップブラウザでも動作します。 Safari、FirefoxなどiPad Safariでロング・バックグラウンド・イメージがレンダリングされない
CSSでbackground-repeatが認識されていますが、残念ながら私の場合は該当しません。
はモバイルSafariはそれが原因あなたの背景のサイズにサブサンプリングする前に、あなたはこの問題で打たれて表示されますするにはどのようなサイズの背景画像の制限があります。
復号化されたGIFの最大サイズ、PNG、およびTIFFイメージは、RAMが256 MB未満のデバイスでは3メガピクセル、256 MB以上のRAMでは5メガピクセルです。
つまり、RAMの容量が256 MB未満のデバイスでは、幅*高さが3 * 1024 * 1024であることを確認してください。デコードされたサイズは、画像の符号化されたサイズよりはるかに大きいことに注意してください。
は、以下を参照してください。Know iOS Resource Limits
あなたは、複数の背景画像を使用することによって、これを達成することができます。あなたの長いJPEGをスライスして、限界に適合した管理可能なチャンクにしてから、css3の魔法を使ってそれらをすべて1つのバックグラウンドにマージします。
は、例えば私が2,048ピクセルチャンクに7400px高い画像をスライスし、これと一緒に戻ってそれらを配置：
background-image: url('../images/bg_ipad1.jpg'), url('../images/bg_ipad2.jpg'), url('../images/bg_ipad3.jpg'), url('../images/bg_ipad4.jpg');
background-position: center 0px, center 2048px, center 4096px, center 6144px;
background-size: auto auto;
background-repeat: no-repeat;
この負荷をiPadでフル解像度で。
うわー、複数の背景画像を使用して、非常に賢いです。 –
background-repeat：があなたに当てはまらない方法を説明できますか？それとも、あなたのサンプルURLの外で使用したい画像が再現性がないからですか？ – Luke
理論的には、この例では確かに 'background-repeat'を使うことができます。ただし、Safari（iPad）で背景画像を表示したときに背景画像がレンダリングされないことを示すだけです。 – moey
pjumbleはそれをすべて披露しました:) – Luke