多方向、複数画像、視差スクロール

Question

"テーブルトップ"デザイン、つまりページ全体にdivページを散らばった単一のページにウェブサイトを作成しています。

ナビゲーションのためにscrollToを使用しています。ナビゲーションのアニメーション中に、背景の上にある画像に視差スクロールを行い、奥行き感と動きの感触を助けてください。

私はこの時点で多くのプラグインを使用していますが、私が探しているものを提供していないことが分かりました。すべての画像がページのさまざまな領域で開始位置にあるため、ページの読み込み時に設定された位置を持つことができます。これを行う必要があるイメージの量が大きくなる可能性があります。

私はこれまでずっと長い間続いていましたが、今はあなたを使う必要がありますGENIUSES OF THE INTERNET私を救うために！あなたは簡単にjQueryプラグインにするために$.fnにこれを添付することができますが

Answer 1

ラスタースクロールは、プラグインのための本当の必要性かなり単純ではありません：

<img src="foo.jpg" id="parallax1" class="parallax"> 

<style> 
.parallax { 
    position : fixed; 
    top  : 0px; 
    left  : 0px; 
} 
</style> 

<script> 
var scroller = $('#parallax1'); 
$(window).bind('scroll', function(){ 
    var top = this.scrollTop; 
    $('#parallax1').css('top', top * someMultiplier); 
}); 
</script>