2

好的，我的问题很简单，但我不确定答案是否会是。我有一个固定在浏览器窗口底部的元素。当不需要它时，我想隐藏它（将高度设置为 0px）。当用户的鼠标距离窗口底部（不是文档）距离 X 个单位时，我想再次显示 div。我用谷歌搜索了一下，我能找到的只有当页面滚动到远离底部的 X 个单位时触发事件/执行操作的信息。如果我能指出正确的方向，我不需要如何执行此操作的确切代码。

问题（对于那些没有看到它的人）：
当鼠标指针位于浏览器窗口底部（不是文档）的 X 单位内时，如何触发事件/执行函数？

一些注意事项：
这是针对油脂猴/用户脚本的，因此答案不必适用于 IE。
请不要建议使用图书馆。对于这么小的东西，需要整个库并不是我愿意接受的答案。

答案： 以 Kir lvlev 下面的回答为基础（记得给他的回答投票）：

// Standards compliant browsers
// if you have an IE solution, post it in the comments and I will add it.
window.addEventListener("mousemove",function(e) {
    // 20 is the number of pixels from the bottom inwhich the action should be preformed
    if ((this.innerHeight - 20) <= e.clientY) {
        //do stuff
    }
});
4

2 回答 2

3

使用 mousemove 事件处理程序

$(window).mousemove(function(e)
{
      //mouse coordinates: e.pageX e.pageY
      //window height $(window).height()
});

非jquery：

window.onmousemove = function(e) {
  //e.clientX e.clientY
  //window.innerHeight
}
于 2012-11-04T01:37:00.180 回答
0

查看我为您制作的这个 jsfiddle：j sfiddle.net/Cnhvm/

那里展示了总体思路。您显然想要重新定位 div、更改其大小并移除背景颜色。还要确保它具有的 z-index 值将其置于页面中任何其他内容的顶部。

这是标准的 JavaScript：onmouseover="hoverOver();"

如果你想保留你的链接，你可以把它们放在 div 上的一些小块中，做更多的工作。

于 2012-11-04T01:56:55.380 回答