由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取。网上说的一般都是触发mousemove事件才行。我这里有两段代码,思路都一样,就是风格不同。

第一段代码是利用全局变量来获取实时鼠标的位置。
var xPos; var yPos;

window.document.onmousemove(function(evt){
      evt=evt ||
window.event;
     if(evt.pageX){
          xPos=evt.pageX;
         
yPos=evt.pageY;
      } else {
         
xPos=evt.clientX+document.body.scrollLeft-document.body.clientLeft;
         
yPos=evt.clientY+document.body.scrollTop-document.body.clientTop;
     
}
});

因为IE和Firefox对clientX的解析不一样,IE认为clientX是鼠标相对整个页面左上角的位置,而Firefox认为是相对当前所见页面左上角的位置。而这段代码最终返回的结果是整个页面左上角的位置。这段代码的缺陷是,xPos和yPos是实时变动的。

第二段代码是通过函数获取当前时刻的鼠标坐标值
function getPosition(event){
       event=
event || window.event;
       if(event.pageX || event.pageY){
          
return {x:event.pageX, y:event.pageY};
       }
       return
{x:event.clientX + document.body.scrollLeft - document.body.clientLeft,
   
       y:event.clientY + document.body.scrollTop   -
document.body.clientTop
      
};
}
这段代码的来源是这里,这个网站还提供了一些简单的样例给我们玩耍。这个函数和刚才的函数理论是一致的,先触发mousemove事件,然后获取了事件之后,分别判断浏览器类型。这段代码的优点是,不适用全局变量,并且可以随用随拿,只要调用这个函数,就能够获取鼠标坐标。

兼容IE FF 获取鼠标位置的更多相关文章

  1. JS获取鼠标位置,兼容IE FF

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

  2. javascript:与获取鼠标位置有关的属性

    javascript并没有mouse对象,获取鼠标坐标要靠强大的event对象。 我们通过监听document的mousemove,就可以实时获得鼠标位置。 但是!!event中和鼠标相关的属性太多了 ...

  3. jq获取鼠标位置

    jq获取鼠标位置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. C++获取鼠标位置及全局检测鼠标行为

    1.获取鼠标位置(在屏幕的位置)  CPoint m_mouse; GetCursorPos(&m_mouse); 2. 屏幕转化为客户端(控件的相对位置)& 客户端位置转化为屏幕位置 ...

  5. jquery 获取鼠标位置

    //获取鼠标位置 $(function(){ $('body').mousemove(function(e) { e = e || window.event; __xx = e.pageX || e. ...

  6. Adobe Edge Animate –获取鼠标位置及跟随鼠标功能实现

    Adobe Edge Animate –获取鼠标位置及跟随鼠标功能实现 版权声明: 本文版权属于 北京联友天下科技发展有限公司. 转载的时候请注明版权和原文地址. 在网络上浏览有关Edge相关问题的时 ...

  7. JavaScript获取鼠标位置的三种方法

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的游览器下会有不同的结果甚至是有的游览器下没结果,这篇文章就鼠标点击位置坐标获取做一些简单的总结. 获取鼠 ...

  8. C# 图像处理:获取鼠标位置信息(全局)

    Point ms = Control.MousePosition; //获取鼠标位置 this.label2.Text = string.Format("{0}:{1}", ms. ...

  9. canvas获取鼠标位置

    canvas获取鼠标位置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

随机推荐

  1. [转帖]Docker里运行Docker docker in docker(dind)

    Docker里运行Docker docker in docker(dind) http://www.wantchalk.com/c/devops/docker/2017/05/24/docker-in ...

  2. OneZero第二周第五次站立会议(2016.4.1)

    会议时间:2016年4月1日 会议成员:冉华,张敏,夏一鸣.(王请假). 会议目的:汇报前一天工作,会议成员评论. 会议内容: 1.前端,由夏,张负责汇报,完成前端功能,待命. 2.数据逻辑控制,由王 ...

  3. SpringBoot(十四)_springboot使用内置定时任务Scheduled的使用(一)

    为什么使用定时? 日常工作中,经常会用到定时任务,比如各种统计,并不要求实时性.此时可以通过提前设置定时任务先把数据跑出来,后续处理起来更方便. 本篇文章主要介绍 springboot内置定时任务. ...

  4. 1643【例 3】Fibonacci 前 n 项和

    1643:[例 3]Fibonacci 前 n 项和 时间限制: 1000 ms         内存限制: 524288 KB sol:这题应该挺水的吧,就像个板子一样 1 0 01 1 0   * ...

  5. BZOJ2326 HNOI2011数学作业(矩阵快速幂)

    考虑暴力,那么有f(n)=(f(n-1)*10digit+n)%m.注意到每次转移是类似的,考虑矩阵快速幂.首先对于位数不同的数字分开处理,显然这只有log种.然后就得到了f(n)=a·f(n-1)+ ...

  6. Day23-Model操作和Form操作-转载

    参考出处: http://blog.csdn.net/fgf00/article/details/54614706 Model和Form以及ModelForm简介 Model操作: 创建数据库表结构 ...

  7. MT【76】直线系

    解答 :答案是3,4.

  8. 【题解】 bzoj2435: [Noi2011]道路修建 (傻逼题)

    bzoj2435,懒得复制,戳我戳我 Solution: 模拟即可(有点傻逼啊 Code: //It is coded by Ning_Mew on 5.13 #include<bits/std ...

  9. bzoj1345 序列问题 (贪心)

    考虑某个点产生的贡献: 如果i左边是一个比它小的数x,那有两种情况: 1.x的左边的数y大于i,肯定要把x合并到i,i的贡献++ 2.x的左边的数y小于i,那肯定要把x合并到y,而这时候递归地来考虑, ...

  10. 《剑指offer》— JavaScript(29)最小的K个数

    最小的K个数 题目描述 输入n个整数,找出其中最小的K个数.例如输入4,5,1,6,2,7,3,8这8个数字,则最小的4个数字是1,2,3,4. 思路一 使用JavaScript的Array对象的so ...