手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JS获取鼠标坐标的实例方法
JS获取鼠标坐标的实例方法
摘要:复制代码代码如下:varrestrictX;varrestrictY;vartip;//鼠标坐标functionmousePosition(...

复制代码 代码如下:

var restrictX;

var restrictY;

var tip;

// 鼠标坐标

function mousePosition(ev) {

return {

x : ev.clientX + document.documentElement.scrollLeft - document.documentElement.clientLeft,

y : ev.clientY + document.documentElement.scrollTop - document.documentElement.clientTop

};

}

// 鼠标事件

function mouseMove(ev) {

ev = ev || window.event;

var mousePos = mousePosition(ev);

restrictX = mousePos.x;

restrictY = mousePos.y;

}

document.onmousemove = mouseMove;

document.onclick = mouseMove;

上面的代码在谷歌和搜狐浏览器中获取的值会不准确,需进行修改,如下:

复制代码 代码如下:

var restrictX;

var restrictY;

var tip;

// 鼠标坐标

function mousePosition(ev){

var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

return {

x:ev.clientX + scrollLeft - document.documentElement.clientLeft,

y:ev.clientY + scrollTop - document.documentElement.clientTop

};

}

// 鼠标事件

function mouseMove(ev){

ev = ev || window.event;

var mousePos = mousePosition(ev);

restrictX = mousePos.x;

restrictY = mousePos.y;

}

document.onmousemove = mouseMove;

document.onclick = mouseMove;

复制代码 代码如下:

var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

这两句为,如果能获取到鼠标坐标,则去前面,否则用后面的方法获取鼠标坐标,“|| ”后面的是给WebKit 内核的浏览器使用

【JS获取鼠标坐标的实例方法】相关文章:

JavaScript获取当前运行脚本文件所在目录的方法

JavaScript获得指定对象大小的方法

JavaScript获得url查询参数的方法

js实现鼠标经过表格行变色的方法

javascript获取select值的方法分析

JS动态增删表格行的方法

JS实现窗口加载时模拟鼠标移动的方法

JavaScript获取两个数组交集的方法

JavaScript实现鼠标拖动效果的方法

js获取页面description的方法

精品推荐
分类导航