当前位置: 首页 > 图文教程 > 网络编程 > Javascript > js获取鼠标位置杂谈附多浏览器兼容代码

Javascript
DOM相关内容速查手册
[转]JS宝典学习笔记
背景,文字渐变(无闪屏)
一个仿DOS的Loading效果
JavaScript使用prototype定义对象类型
如何用JS获取带“\”字符串的中间值?
如何识别上传前检测的图像是有效的方法
js模拟滤镜的图片渐显效果
如何用javascript去掉字符串里的所有空格
javascript如何判断数组内元素是否重复的方法集锦
控制打印时页眉角的代码
模仿Flash AS效果的导航菜单
页面自定义拖拽布局
js判断浏览器的比较全的代码
又一日历输入效果没考虑兼容性,IE通过
项目添加
[转]prototype 源码解读 超强推荐
JAVASCRIPT对象及属性
JavaScript解决Joseph问题
实例:用 JavaScript 来操作字符串(一些字符串函数)

Javascript 中的 js获取鼠标位置杂谈附多浏览器兼容代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 326 ::
收藏到网摘: n/a

最近在搞一个AJAX的小功能,目的是用浮动div框显示当前鼠标下控件的详细信息,其中获得鼠标位置这块害得我走了很多冤枉路,因为压根没有想到我下面提到的第二点的区别,所以我的页面出来总是找不到我之前定义的那个div 其实获得鼠标位置就是一句话的事情,但是要是不了解浏览器间的区别,整个过程就会让人很郁闷,区别在与:
1.IE下获得x和y轴的距离分别用event.x和event.y;
FF下获得x和y轴的距离分别用event.pageX和event.pageY;
2.IE下用此方法获得的位置是不算滚动条滚过的位置的,即它只会算到浏览器边缘;
FF则会算进滚过去的那些位置;
(这个地方很让我崩溃,为这么点小区别我把所有用到的程序全部重写了一遍,囧死……)
解决1的办法,无非是判断一下浏览器,然后用什么方式;
解决2的办法,是在IE的情况下在x和y轴分别加上document.documentElement.scrollTop和document.documentElement.scrollLeft;
对JS我了解的比较少,如果大家有更好的建议欢迎留言指教!谢谢
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]