<div class="wrap">
<div class="layer">
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
</div>
</div>
<span class="next" style="cursor:pointer;"> (next div) </span>
带ScrollTo插件的jQuery(http://demos.flesler.com/jquery/scrollTo/)
$('.next').click(function() {
$(".wrap").scrollTo( $('.post').next(), 800, {margin:true} );
});
演示:http://jsfiddle.net/UaGjs/8/
它不工作:(它只工作第一次
4条答案
按热度按时间inb24sb21#
使用Tomalak的答案,您需要将引用obj指向更新到下一个元素
http://jsfiddle.net/UaGjs/7/
我已经用Prev更新了它,但它可以改进以删除重复
http://jsfiddle.net/UaGjs/10/
我注意到有一个名为Serial Scroll的插件
最终编辑
http://jsfiddle.net/nickywaites/UaGjs/13/
yks3o0rb2#
因为您总是使用
$('.post')
重新获得DOM元素的句柄,而不是重复使用对象并在其上迭代调用.next()
。试试下面的方法。它还没有经过测试,而且还很粗糙,但应该可以演示如何绕过范围问题。
mw3dktmi3#
因为您总是使用
$('.post')
重新获得DOM元素的句柄,而不是重复使用对象并在其上迭代调用.next()
。试试下面的方法。它还没有经过测试,而且还很粗糙,但应该可以演示如何绕过范围问题。
mqkwyuun4#
我没有太多的运气与下一个()。我所做的是将同一个类的所有元素加载到一个数组中:
然后初始化一个索引:
然后遍历数组:
希望这是有帮助的!