web-dev-qa-db-ja.com

iOSで修正されたバックグラウンド添付ファイルを複製する方法

私は学校プロジェクトのiOSで固定背景画像divを取得しようとしています。私は使ってきました

background-attachment: fixed;

しかし、これはモバイルサファリで奇妙なサイズ変更とスクロール効果をもたらさない。 こちらがサイトです 私が一緒に仕事をしています;現在引用div画像の背景に使用している方法はデスクトップではうまく機能しますが、iOSでは完全に失敗します。

どういうわけか、 http://www.everyonedeservesgreatdesign.com はこれを機能させました。ある種のスクエアスペーステンプレートを使用しているため、コードを追跡するのは困難ですが、親のposition:fixedによって何らかの形でクリップされているposition:relative divに画像を入れているようです。 position:fixed divをビューポート以外でクリップすることはできないという印象を受けていたので、ここで何が起こっているのか非常に興味があります。

私のサイトの固定画像div背景にこのメソッドを実装する方法に関するアイデアはありますか？

htmlioscss
71
QRohlf

これは過去に尋ねられましたが、明らかにモバイルブラウザに多大な費用がかかるため、無効になっています。

チェック @ PaulIrishによるこのコメント ：

固定背景にはhugeの再描画コストがかかり、スクロールパフォーマンスが低下します。

あなたはこの投稿でこれに対する回避策を見ることができます：

ios7で固定された背景画像

iOS7のページでの本文の背景スクロールの修正

104
fernandopasik

背景画像は実際には背景画像ではないようです...サイトには背景画像と兄弟divの引用符があり、divの子には位置が割り当てられた画像が含まれています。引用符divには透明な背景も与えられます。

wrapper div{
   image wrapper div{
       div for individual image{ <--- Fixed position
          image <--- relative position
       }
   }
   quote wrapper div{
       div for individual quote{
          quote
       }
   }
 }
2
unconditional_loading