时差滚动核心代码(Parallax Scrolling Core Code)
这是我见过的最棒的讲时差滚动的例子!简洁明了耶!
$(window).bind('scroll',function(e){ parallaxScroll(); }); function parallaxScroll(){ var scrolled = $(window).scrollTop(); $('#parallax-bg1').css('top',(0-(scrolled*.25))+'px'); $('#parallax-bg2').css('top',(0-(scrolled*.5))+'px'); $('#parallax-bg3').css('top',(0-(scrolled*.75))+'px'); }
来源:Build a parallax scrolling website interface with jQuery and CSS (By Jonathan Nicol.) http://f6design.com/journal/2011/08/06/build-a-parallax-scrolling-website-interface-with-jquery-and-css/
根据需要,改变:
- background-position:
- top
- margin-top