一、screenX | screenY用于获取鼠标相对屏幕的位置
在IE9+和其他主流浏览器,获取鼠标相对屏幕的位置,代码如下:
function (ev){
ev.screenX //获取鼠标相对于屏幕左边的距离
ev.screenY //获取鼠标相对于屏幕顶部的距离
}
在IE浏览器下,获取鼠标相对屏幕的位置,代码如下:
function(){
window.event.screenX //获取鼠标相对于屏幕左边的距离
window.event.screenY //获取鼠标相对于屏幕顶部的距离
}
兼容所有浏览器情况下,获取鼠标相对屏幕的位置,代码如下:
function (ev){
var ev = ev || window.event;
ev.screenX //获取鼠标相对于屏幕左边的距离
ev.screenY //获取鼠标相对于屏幕顶部的距离
}
二、clientX | clientY 获取鼠标相对于浏览器可视区域的位置
在IE9+和其他主流浏览器下,获取鼠标相对浏览器可视区域的位置,代码如下:
function (ev){
ev.clienX //获取鼠标距离浏览器可视区域左边的距离
ev.clienY //获取鼠标距离浏览器可视区域顶部的距离
}
在ie浏览器下,获取鼠标距离浏览器可视区域的位置,代码如下:
function (){
window.event.clienX //获取鼠标距离浏览器可视区域左边的距离
window.event.clienY //获取鼠标距离浏览器可视区域顶部的距离
}
兼容所有浏览器情况下,获取鼠标相对于浏览器可视区域的位置,代码如下
function (ev){
var ev = ev || window.event;
ev.clienX //获取鼠标距离浏览器可视区域左边的距离
ev.clienY //获取鼠标距离浏览器可视区域顶部的距离
}
三、pageX | pageY 获取鼠标相对于文档的位置
在IE9+和其他主流浏览器下,获取鼠标相对于文档的位置,代码如下:
function (ev){
ev.pageX //获取鼠标相对于文档的左边的距离
ev.pageY //获取鼠标相对于文档的顶部的距离
}
在IE8以下浏览器包括IE8浏览器,如何获取鼠标相对于文档的位置??
获取鼠标相对于浏览器可视区域的位置 + 滚动条移动的距离 = 获取鼠标相对于文档的位置
解决方法一:
function(ev){
try{
//IE9+ 和 其他主流浏览器
ev.pageX //鼠标距离于文档的左面的距离
ev.pageY //鼠标距离于文档的顶部的距离
}catch(err){
//IE8 IE7 IE6
window.event.clientX+document.documentElement.scrollLeft //鼠标距离于文档的左面的距离
window.event.clientY+document.documentElement.scrollTop //鼠标距离于文档的顶部的距离
}
}
解决方法二:
function (ev){
var ev = ev || window.event;
var sLeft = document.body.scrollLeft == 0 ? document.documentElement.scrollLeft : document.body.scrollLeft ;
var sTop = document.body.scrollTop == 0 ? document.documentElement.scrollTop : document.body.scrollTop ;
ev.clientX + sLeft //获取鼠标距离浏览器可视区域左边的距离
ev.clientY + sTop //获取鼠标距离浏览器可视区域顶部的距离
}
注释:在Chrome可以通过document.body.scrollLeft,document.body.scrollTop计算出页面滚动位移,而在IE、firefox下可以通过document.documentElement.scrollLeft ,document.documentElement.scrollTop。
相关文章
- C#中如何获取鼠标及控件的位置坐标(相对于屏幕)
- Unity UGUI获取鼠标在屏幕的准确点击位置
- window.pageXOffset /pageYOffset 和 scrollLeft、scrollTop 返回当前页面相对于窗口显示区左上角的坐标位置
- 通过了解JS的clientX、pageX、screenX等方法来获取鼠标位置相对屏幕,相对浏览器窗口,相对文档的坐标详解
- 如何获得相对于挥杆窗口的鼠标单击位置
- 获取鼠标点相对于各屏幕、窗体和当前控件的位置
- 请教,如何获取鼠标单击位置相对于屏幕位置的坐标点
- WPF获取鼠标相对于屏幕的绝对位置
- 如何在Mac OS X中获取相对于窗口的光标位置?
- WPF 获得鼠标相对于屏幕的位置,相对于控件的位置