腳本向下滾動，只要它被點擊

Question

我想創建一個JQuery腳本，滾動到下面的下一個div，每當用戶點擊。

我有一個頂部的每個DIV的像素偏移量的數組。
我不知道如何循環或 計算點擊次數。

jQuery(document).ready(function(){ 
    var move=[0,642,1725,2393,3036,6097,6991]; 
    var i=0; 
    var duration = 500; 

    jQuery(".next").click(function(){ 
     //event.preventDefault(); 

     jQuery('html, body').animate({scrollTop: move[i]+'px'}, duration); 
    })  
}); 

Answer 1

嘗試i = (i == 7)?i=0:i;和move[i++]

jQuery(document).ready(function() { 
    var move = [0, 642, 1725, 2393, 3036, 6097, 6991]; 
    var i = 0; 
    var duration = 500; 
    jQuery(".next").click(function() { 
     //event.preventDefault(); 
     i = (i == 7)?i=0:i; 
     jQuery('html, body').animate({ 
      scrollTop: move[i++] + 'px' //set current value and increment it by 1 
     }, duration); 
    }) 
}); 

Answer 2

只需在處理程序中增加它？

$(function() { 
    var move=[0,642,1725,2393,3036,6097,6991], 
     i = 0, 
     duration = 500; 

    $('.next').on('click', function(e) { 
     e.preventDefault(); 
     $('html, body').animate({scrollTop: move[i]+'px'}, duration); 
     i++; 
    }); 
}); 

我會忍不住有jQuery的獲取要滾動到雖然元素offset().top位置，否則你將需要改變每一個你的代碼或內容修改時間數組值...

你也很可能需要在回調函數中做一些檢查，以避免溢出：

$(function() { 
    var move=[0,642,1725,2393,3036,6097,6991], 
     i = 0, 
     duration = 500; 

    $('.next').on('click', function(e) { 
     e.preventDefault(); 
     if(i < move.length) 
     { 
      $('html, body').animate({scrollTop: move[i]+'px'}, duration); 
      i++; 
     } 
    }); 
});