滾動到下一個div

Question

我有以下代碼。 目前，它僅向下滾動變量的高度。

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

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

問題：

• 為什么只滾動一次？
• 能否更好地實現：每次點擊都能滾動瀏覽每個兄弟姐妹？

Answer 1

您每次都滾動到同一位置。 最簡單的方法是計算下一個框的偏移位置：

http://jsfiddle.net/B472g/

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

請注意，這不會處理最后一個框的操作。.取決於您要如何實現它。

Answer 2

使用這個-http://jsfiddle.net/gF6U3/3/

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