背景画像、透明な部分を持つ固定ヘッダー画像、半透明の背景を持つコンテンツ div、および従来のヘッダー/コンテンツ/フッター レイアウトの動的な高さがあるとします。
私が達成しようとしている効果:固定ヘッダーの下で背景とコンテンツをスクロールします(コンテンツが非表示で背景が表示されます)。
Hide Scrolling Content Under Transparent Headerなどの関連トピックをたくさん読みました が、背景も修正できる状況を扱っています。私のものはスクロール可能でなければなりません。
同じ背景画像をヘッダー画像divのラッパーdivに追加し、.scrollTop()ウィンドウスクロールイベントでjQueryでスクロールすることで、必要なものを取得できました。
参考：jsbinの例
参考：jsFiddleの例
この方法の問題点は、Firefox 以外のすべてのブラウザーで同期がかなり悪いことです (多少のラグ、テアリング)。
明確にするために:コンテンツの高さは動的になります。10000px私は例のために選んだだけです。私はそれが非常に頻繁に到達すると予想していますが、時にはそれ以上 (AJAX フィード) であり、一部のページでは0. だから私も同期し.height()ています。下部のフッター divはコンテンツ divの下にあることに注意してください。
そして、もっと良い方法が必要だと思います。助言がありますか？