栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

JS获取鼠标坐标的实例方法

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

JS获取鼠标坐标的实例方法

复制代码 代码如下:
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 内核的浏览器使用
转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/110774.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号