爲什麼$（window）.animate scrollTop不起作用？

如果下面的代碼工作（這當然不會）

$('html, body').animate(
    { 
     "scrollTop": "500" 
    }, 
    500 
);

那麼爲什麼不將下面的代碼工作？

$(window).animate(
    { 
     "scrollTop": "500" 
    }, 
    500 
);

如果下面的代碼工作

$(window).scroll(myScrollFunctionHandler);

那麼爲什麼不將下面的代碼工作？

$('html, body').scroll(myScrollFunctionHandler);

請問有人能爲此做出全面的解釋嗎？

來源

2012-10-15 supertonsky

window沒有scrollTop屬性，這就是爲什麼你的第一個例子不起作用。 document.body呢。

至於你的第二個例子，$(window).scroll是window.onscroll的事件處理程序安裝程序。沒有「body onscroll」事件，因此很明顯安裝在body（或html）元素上的事件處理程序不會被調用，因爲事件不會使DOM向下滾動，而只會觸發事件。

來源

2012-10-15 08:34:06

你是什麼意思，這不是標準？不，它接受一個回調函數，當所選對象滾動時將使用該函數。 – supertonsky

我錯了$ .scroll--這是一個滾動處理程序，而不是一個滾動功能（像scrollTo，我很困惑它）。導致差異的原因是onscroll事件在窗口對象上觸發，而不是在body元素上觸發。 –

這應該是由於$(window).animate()的內部工作。實驗結果表明，在這個jQuery animate（）代碼中，$(window).scrollTop()總是返回零，$(window).scrollTop(value)無法正確設置值。

但是，這些工作在animate()之前及其步驟回調函數中。因此，下面的代碼可以正常工作。

function scrollNow(final_val){ 
    var initial_val = $(window).scrollTop(), 
     diff = final_val - initial_val 
    ; 
    $(window).animate(
     { 
      scrollTop: diff, 
     }, 
     { 
      duration: 1000, 
      step: function(now, fx){ 
       $(window).scrollTop(initial_val + now); 
      } 
     } 
    ); 
}

來源

2017-02-06 16:59:54 alan

爲什麼$（window）.animate scrollTop不起作用？

回答

相關問題