代码之家 › 专栏 › 技术社区 › Giuseppe Pes

如何在鼠标点击页面底部时触发事件

css html jquery javascript

Giuseppe Pes · 技术社区 · 10 年前

我正在尝试实现一个菜单栏,其工作方式与windows任务栏类似。我想模拟的属性之一是当鼠标进入页面底部时隐藏/显示。如何检测鼠标何时位于页面底部?

首先,是否有JQuery插件或类似的库已经实现了此操作?

一个可能的解决方案是在底部使用一个不可见的div,当鼠标进入时它会触发事件。

2 回复 | 直到 10 年前

T J 10 年前

如果使用jQuery不是问题

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

会的,检查一下 Fiddle

注:我给了10倍的呼吸空间

更新: 摆弄任务栏般的div- Updated Fiddle

-1

Vishal Nair 10 年前

你可以这样做-->

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