jquery鼠标相对窗口的位置

问题描述：

我想要获取相对于窗口的确切鼠标位置。jquery鼠标相对窗口的位置

这里是我的问题...

document.height = 1600（实际文档大小）
window.height = 400（可视范围）

我需要相对于鼠标位置弄清楚该窗口，而不是pageY属性提供的文档。

这是一个很大的工具提示，它会弹出一个表项的mouesover。如果屏幕底部没有足够的空间（窗口最大），则工具提示显示在指针上方，否则显示在指针下方。这项工作正常，直到文档大小大于pagesize（长表）。

感谢，吕克

答

您可以减去window从pageY的.scrollTop()获得位置的窗口，像这样：

var top = e.pageY - $(window).scrollTop();

You can give it a try here, take a look at the console。

你们真棒。那样做了！谢谢！！ – user425772 2010-08-19 21:51:28

@lucl - 欢迎:)欢迎来到SO！ – 2010-08-19 21:52:05

伟大的解决方案，如此简单。 OP应标记为解决方案。 – 2015-03-06 18:51:40

答

如何处理document.body.scrollTop属性，它包含您滚动的像素。我相信一个简单的pageY - scrollTop应该就足够了吗？

答

那么window.pageYOffset呢？

演示：

<html> 
<head> 
<style> 
    html,body {padding:0;margin:0} 
    #content {height:2048px;background-color:#ccc;} 
    #status {position:fixed;top:0;left:0;} 
</style> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    $(document).mousemove(function(e){ 
     $('#status').html(e.pageX +', '+ (e.pageY - window.pageYOffset)); 
    }); 
}) 
</script> 
<body> 
<h2 id="status">0, 0</h2> 
<div id="content"></div> 
</body> 
</html>

答

function showCoords(evt){ 
    alert(
    "clientX value: " + evt.clientX + "\n" 
    + "clientY value: " + evt.clientY + "\n" 
); 
}

我认为这是你在找什么。详细请参阅here from Mozilla Developer。

jquery鼠标相对窗口的位置

相关推荐