鼠标相对于屏幕的位置、鼠标相对于窗口的位置和获取鼠标相对于文档的位置

一、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。

时间: 2024-10-08 14:53:52

鼠标相对于屏幕的位置、鼠标相对于窗口的位置和获取鼠标相对于文档的位置的相关文章

获取div相对文档的位置

获取div相对文档的位置,两个方法 经测试 document.getElementById("btn").getBoundingClientRect() 在IE6下有2像素的bug,不知道为什么. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <

Dreamweaver里文档工具栏位置

文档工具栏有时候在不经意见会被隐藏, 它的位置:查看—工具栏—文档,将文档前面的对勾去掉或打上,就可以隐藏或显示文档栏了.

文档存储位置及备份情况

core data 存储的位置是Documents文件夹下,nsuserdefault 存储的路径为Library/Prefereces下的一个plist文件,因此在备份app时两者都会备份(library下的caches文件夹下的数据是不会备份的).

e.pageX;event.clientX,event.clientY,scrollLeft,clientLeft获取鼠标位置

示例一: x方向没有滚动 var mx=0,my=0; function mouseMove(ev){Ev=ev||window.event;var mousePos=mouseCoords(Ev);mx=mousePos.x;my=mousePos.y;} function mouseCoords(ev){ if(ev.pageX||ev.pageY){ return{x:ev.pageX,y:ev.pageY}; } return{x:ev.clientX,y:ev.clientY+$(do

获取鼠标停留的位置和设置鼠标的停留的地方

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> <input

C#如何获取鼠标相对当前窗口的坐标

可以用Control.MousePosition获得当前鼠标的坐标,使用PointToClient计算鼠标相对于某个控件的坐标,如下 1 Point screenPoint = Control.MousePosition;//鼠标相对于屏幕左上角的坐标 2 Point formPoint = this.PointToClient(Control.MousePosition);//鼠标相对于窗体左上角的坐标 3 Point contextMenuPoint = contextMenuStrip1.

jquery获取元素坐标获取鼠标坐标

获取页面某一元素的绝对X,Y坐标,可以用offset()方法: var X = $('#DivID').offset().top; var Y = $('#DivID').offset().left; 获取相对(父元素)位置: var X = $('#DivID').position().top; var Y = $('#DivID').position().left; 让Div随滚动条移动: <div id="oLayer" style="position: abso

获取鼠标点相对于各屏幕、窗体和当前控件的位置

//获取鼠标相对于当前控件的位置 Point mousePos = dgvAddCommand.PointToClient(MousePosition); //获取鼠标相对于当前窗体的位置 mousePos = PointToClient(MousePosition); //获取鼠标相对于屏幕左上点的位置 mousePos = PointToScreen(MousePosition); //偏移位置 mousePos.Offset(3, 20);

WPF 获取鼠标屏幕位置、窗口位置、控件位置

原文:WPF 获取鼠标屏幕位置.窗口位置.控件位置 public struct POINT { public int X; public int Y; public POINT(int x, int y) { this.X = x; this.Y = y; } } [DllImport("user32.dll")] public static extern bool GetCursorPos(out POINT lpPoint); //e.GetPosition(this); //(e