如何在$一次滾動（窗口）.scroll（）有另一個滾動命令

我有一個垂直的照片瀏覽器

，我需要一個滾動的效果是一次頁面高度時，鼠標滾輪向下。

，所以我有下面的代碼

$(document).ready(function() { 
     $(window).scroll(function() { 
      var H = $(window).height(); 
      var st = $(this).scrollTop(); 
      $("html, body").animate({ scrollTop: H + st }, 500, function() { 
       console.log("finish scroll"); 
      }); 
     }); 
    });

但是，當我再滾動，它會一次又一次地重複，直到底部。

我該如何解決這個問題？

在此先感謝。

來源

2014-04-22 Nicky Liu

您可以嘗試使用計數器，在滾動事件中增加它，但只有在計數器===時才執行自定義滾動操作。1.在動畫回調中，您將重置它。 –

看看jQuery [one]（http://api.jquery.com/one/） –

問題是動畫也做滾動事件。所以你有一個滾動循環。要解決該問題，您可以添加一個標誌。

這不是解決你的問題，但最好的方式，你可以做到這一點=>http://jsbin.com/qagayopu/2/edit

來源

2014-04-22 15:03:50

結果和以前一樣@@「 –

它幾乎完美，但我不知道爲什麼」完成滾動「會在一個滾動中切換兩次？這是我的測試頁面=> http://crelation.com/freeMag/Viewer 在此先感謝。 –

我用一個計數器和一個定時器，使得滾動完成後計數器等待半秒..

http://jsfiddle.net/beardedSi/p45rH/1/

$(document).ready(function() { 

var H = $(window).height(), 
    go = true; 
console.log(H); 
//just for visual, set the height of boxes to be same as window height 
//to check it is all working 
$('.box').css('height', H + "px"); 

function scroller() { 
    $("html, body").animate({ 
     scrollTop: '+=' + H 
    }, 400, function() { 
     console.log("finished"); 
     setTimeout(function() { 
      go = true; 
     }, 400); 
    }); 
} 

$(document).on('scroll', function (e) { 
    e.preventDefault(); 
    if (go) { 
     go = false; 
     scroller(); 
    } 
});

}）;

來源

2014-04-22 16:08:29

如何在$一次滾動（窗口）.scroll（）有另一個滾動命令

回答

相關問題