确定鼠标是否始终位于页面底部

Determine whether mouse is always on the bottom of the page

本文关键字:于页面 底部 鼠标 是否      更新时间:2023-09-26

如何确定鼠标是否始终在视口的底部?让我们假设我们所说的底部是指给定页面的底部100像素(在一个长滚动页面上)。

这是一个例子,检查箭头http://discover.store.sony.com/tablet/设计/重量分布

轻松!

使用window.screen.height和document.height计算当前窗口中显示的"底部"区域的大小。

然后使用onmousemove事件来计算鼠标是否步过该区域

创建一个你想要的尺寸的空白div,使用CSS来定位:absolute;它位于底部,并将其置于其他元素之上,然后创建一个onHover来检测鼠标是否在那里

编辑

这可能是一个解决方案,以避免使用上面的CSS方法(未经测试)

$(function(){
  $.mousemove(function(e){
    var wHeight = $(window).height();
    var yMouse = e.pageY;
    if(yMouse > (wHeight - 100)) {
      // Do something
    }
  });
});

我想我解决了自己基于牧师骨头的代码:你必须计算窗口滚动顶部

var scrollT = $(window).scrollTop() + wHeight;

:

$(function(){
  $.mousemove(function(e){
    var wHeight = $(window).height();
    var scrollT = $(window).scrollTop() + wHeight;
    var yMouse = e.pageY;
    if(yMouse > (scrollT - 100)) {
      // Do something
    }
  });
});