2014-10-27 108 views
2

我想动画在js上滚动一个简单的div,你可以在这里找到grooveshark。你可以看到,动画作出反应向上/向下滚动并水平移动。 这通常是我需要的。我怎样才能轻松地在js中确定这个功能?由于如何从左向右滚动滚动div?

+0

你试过甚么? – prog1011 2014-10-27 09:52:38

+0

你试过谷歌吗? http://stackoverflow.com/questions/2346958/how-to-do-a-horizo​​ntal-scroll-on-mouse-wheel-scroll – MasterD 2014-10-27 09:54:25

回答

3

这就是所谓的视差

你可以做到这一点使用的CSS属性的变化组合自己和滚动检测事件,或者只是使用像SkrollR http://prinzhorn.github.io/skrollr/

插件对于这个特殊的例子,你可以看到内嵌样式的该分区被改变的滚动(开发人员工具):

<div class="albums-holder" style="background-position: 1174px 50%;">... 

您可以在滚动事件做到这一点:

$(window).scroll(function() { 
    $(".albums-holder").css("background-position", [VALUE]); 
}); 

[VALUE]将通过每次增加/减少背景位置值来计算。

编辑:我没有提到,我的回答是基于你在页面上有jQuery的假设,我推荐它是这样的任务。

+0

非常感谢这个完整的答复! – bep42 2014-10-27 10:26:20

+0

没问题的队友,顺便说一句,漂亮,简单。 – 2014-10-27 10:29:19