javascript - 滚动到下一个 div

Question

我有以下代码。目前，它只向下滚动一个变量的高度。

http://jsfiddle.net/tmyie/gF6U3/1/

$('.col100').click(function(e){
    e.preventDefault();
    var H = $('.col100').outerHeight();
    $('html, body').animate({scrollTop: H}, 200);   
});

问题:

• 为什么只滚动一次？
• 是否可以更好地实现它:因此它会在每次点击时滚动浏览每个 sibling ？

Answer 1

您每次都滚动到相同的位置。最简单的方法是计算下一个框的偏移位置:

http://jsfiddle.net/B472g/

$('.col100').click(function(e){
    e.preventDefault();
    var H = $(this).next().offset().top;
    $('html, body').animate({scrollTop: H}, 200);   
});

请注意，这不会处理最后一个框中要执行的操作。取决于您要如何实现它。