如何在鼠標碰到頁面底部時觸發事件

Question

我試圖實現一個類似於windows任務欄的菜單欄。當鼠標移動到頁面底部時，我想要模擬的屬性之一是隱藏/顯示。 如何檢測鼠標何時位於頁面底部？

首先，是否有JQuery插件或類似的庫已經實現了這個動作？

一個可能的解決方案是在底部使用一個不可見的div，當鼠標進入時觸發事件。我想知道是否有比這更好的解決方案。

Answer 1

如果使用jQuery是沒有問題的

window.onmousemove= function(e){ 
if(e.y>= $(document).height()-10) 
    alert('you did hit the bottom!'); 
} 

就行了。檢查這個Fiddle

注：我已經給了10px的喘息空間

更新：撥弄類似div任務欄 - Updated Fiddle

Answer 2

你可以做這樣的事情 - >

JQUERY

$(document).ready(function(){ 
    $(document).mousemove(function(event){ 
    var docheight = $(document).height() - 10; //subtracted with 10 just to be safe with checking the condition below 

    if(event.pageY > docheight){ 
     alert("you have reached socument bottom"); 
     //write your code here 
    } 

    }); 
}); 

JSFIDDLE DEMO