$（document）.height（）與$（document）.scrollTop（）+ $（window）.height（）之間的差異

Question

我試圖檢測何時出現某個元素，以便可以使其淡入。我覺得只要滾動值接近它，我就可以檢測到它在頁面上的垂直位置並使其淡入。

我遇到的問題是document.height總是比每個頁面上的document.scrollTop（）+ window.height（）的值大得多。 每次的數量也是可變的（我認為這可能是一個問題，這是由於導航漫游器隱藏了桌面菜單並插入了“漢堡”菜單，但是更改的數量因頁面而異。）

從而：

document.body.scrollHeight - $(window).height() == $('body').scrollTop();

在控制台日志中返回false。

有人遇到過這個嗎？ 我很困惑。 清除所有浮動元素。 沒有添加元素/節點，也沒有添加AJAX添加動態內容。

在此先感謝您是否有任何有關導致此問題的理論。

Answer 1

document.height是整個body標簽的高度。 $(window).height()是瀏覽器窗口的高度。 條件的左側從最終計算出的高度減去視口。 這並不意味着它等於文檔的滾動位置。

+ - - - - - - +    + - - - - - - +   + - - - - - - +
:             :    :             :   :  Scroll Top :
:             :    :             :   :  4 lines    :
+=============+    :             :   + - - - - - - +
| window      |    :             :  
| height      |    :   document  :  
| 5 lines     |    :   height    :  
+=============+    : - window    :   
:             :    :   height    :
:             :    :   ________  :
: document    :    :   13 lines  :
: height      :    :             :
: (offscreen) :    :             :
: 18 lines    :    + - - - - - - +
:             :
:             :
:             :
+ - - - - - - +

                     13lines != 4lines

而是嘗試尋找$(document).height() - ($(window).scrollTop() + $(window).height()); 獲取窗口下方事物的起始位置。