ScrollTop（）函數，滾動時間

當調用函數時，頁面向上滾動，但只要動畫時間設置爲，就需要等待，以便能夠再次向下滾動。例如，如果我說ScrollTop（）函數，滾動時間

$('html, body').animate({ scrollTop: 0 }, 800);

這讓我等一會才能再次向下滾動，但如果我寫

$('html, body').animate({ scrollTop: 0 }, 10);

它滾動起來速度快了很多，但我將能夠立即再次向下滾動！我怎樣才能使用800（所以動畫比較酷），但是避免再次等待滾動？

$(window).scroll(function() { 
    if ($(this).scrollTop() > 100) { 
     $('.goToTop').fadeIn(); 
    } else { 
     $('.goToTop').fadeOut(); 
    } 
    $('#goToTop').click(function() { 
     $('html, body').animate({ scrollTop: 0 }, 800); 
     return false; 
    }); 
});

來源

2017-04-01 Masood

您可以添加，將800毫秒之後被調用做任何你想在那個時候的setTimeout（FUNC（）{}，800）。 – fmacdee

您可以用下面的代碼停止任何正在進行的動畫。

$('html,body').stop();

編輯：只有當滾動是由人類觸發時，動畫纔會停止。下面有一個工作小提琴https://jsfiddle.net/sjp3xngo/4/

來源

2017-04-01 18:04:01 lhavCoder

你需要寫.animate()，以降低迴其早先的立場，滾動（其中滾動窗口頂部的一個）的回調函數內部setTimeout功能。工作小提琴here。

$(document).ready(function(){ 
 
    $(window).scroll(function() { 
 
     if ($(this).scrollTop() > 100) { 
 
      $('#goToTop').fadeIn(); 
 
     } else { 
 
      $('#goToTop').fadeOut(); 
 
     } 
 
    }); 
 
    var duration_ms = 800; 
 
    $('#goToTop').click(function() { 
 
     var last_scroll = $(window).scrollTop(); 
 
     $('html, body').animate({ scrollTop: 0 }, duration_ms, function(){ 
 
     \t setTimeout(function(){ 
 
      \t  $('html, body').animate({ scrollTop: last_scroll }, duration_ms); 
 
      \t }, duration_ms); 
 
     }); 
 
    }); 
 
});

#goToTop{ 
 
    cursor: pointer; 
 
    display: none; 
 
    position: fixed; 
 
    bottom: 15px; 
 
    right: 15px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<pre> 
 
    a 
 
    b 
 
    c 
 
    d 
 
    q 
 
    w 
 
    e 
 
    r 
 
    t 
 
    y 
 
    u 
 
    i 
 
    o 
 
    p 
 
    a 
 
    s 
 
    d 
 
    f 
 
    g 
 
    h 
 
    j 
 
    k 
 
    l 
 
    z 
 
    x 
 
    c 
 
    v 
 
    b 
 
    n 
 
    m 
 
    <span id="goToTop">go to top</span> 
 
</pre>

來源

2017-04-01 18:41:47

ScrollTop（）函數，滾動時間

回答

相關問題