• 《寻梦环游记》《至爱梵高》 明年奥斯卡种子选手且看且珍惜 2018-06-23
  • 海南特区改革开放30年:闯出一片辽阔的海 2018-06-23
  • 黑龙江省近三年有400多名责任人因破坏营商环境被处理 2018-06-23
  • 右玉:锣鼓喧天庆盛世 万民欢腾闹元宵 2018-06-23
  • 【手绘H5】我们的领袖习近平 2018-06-23
  • 上市公司并购新三板企业升温 2018-06-23
  • 特朗普再与世界"为敌" 多国斥其关于耶路撒冷决定 2018-06-22
  • 严防“两节”期间“四风”反弹 持续保持高压态势 2018-06-22
  • 反转!华南理工大学否认向莱阳14岁神童发送考察函 2018-06-21
  • 中国出版集团公司总裁谭跃委员:唱响新时代的好声音 2018-06-21
  • 新華網評:分享經濟,別演成分享的“獨角戲” 2018-06-20
  • 红薯会越放越甜吗 如何保存红薯最科学? 2018-06-20
  • 猪肉创八年新低部分养殖户巨亏离场 行业加速洗牌 2018-06-19
  • 招商证券:创业板反弹压力逐渐显现 2018-06-19
  • “一拖二快三”足球比分直400余名应届大学毕业生成为部队“准警官” 2018-06-19
  • javascript获取鼠标当前位置(兼容IE和firefox)

    栏目: 编程语言 发布于: 2014-05-08 13:41:00

    用 JS 计算鼠标在页面上的位置并非难事,但由于IE和Firefox对获取鼠标当前位置的方法不同(IE为event.x|y,FF为event.pageX|Y),一般采用的是event.clientX代替两者,但当出现滚动条时event.clientX在IE和FF中的表现会略有不同。因此 js 获取鼠标当前位置也因各浏览器的区别而有所不同。下面介绍一种通用的获取鼠标在页面上的位置的方法。

    /**
    * 获取鼠标在页面上的位置
    * @param ev		触发的事件
    * @return		x:鼠标在页面上的横向位置, y:鼠标在页面上的纵向位置
    */
    function getMousePoint(ev){
    	//定义鼠标在视窗中的位置
    	var point={
    		x:0,
    		y:0
    	};
    	//如果浏览器支持 pageYOffset, 通过 pageXOffset 和 pageYOffset 获取页面和视窗之间的距离
    	if(typeof window.pageYOffset!='undefined'){
    		point.x=window.pageXOffset;
    		point.y=window.pageYOffset;
    	}
    	//如果浏览器支持 compatMode, 并且指定了 DOCTYPE, 通过 documentElement 获取滚动距离作为页面和视窗间的距离
    	//IE 中, 当页面指定 DOCTYPE, compatMode 的值是 CSS1Compat, 否则 compatMode 的值是 BackCompat
    	else if(typeof document.compatMode!='undefined'&&document.compatMode!='BackCompat'){
    		point.x=document.documentElement.scrollLeft;
    		point.y=document.documentElement.scrollTop;
    	}
    	//如果浏览器支持 document.body, 可以通过 document.body 来获取滚动高度
    	else if(typeof document.body!='undefined'){
    		point.x=document.body.scrollLeft;
    		point.y=document.body.scrollTop;
    	}
    	//加上鼠标在视窗中的位置
    	point.x+=ev.clientX;
    	point.y+=ev.clientY;
    	//返回鼠标在视窗中的位置
    	return point;
    }

    demo 展示

    您可能感兴趣的文章

    • js获取鼠标当前位置,兼容ie和firefox
    • javascript判断鼠标左右键点击-兼容ie、firefox、chrome等各大主流浏览器
    • js屏蔽鼠标右键,兼容IE和firefox
    • js屏蔽鼠标键盘事件(包括鼠标右键,方向键,退格键,F5刷新键等),兼容IE和firefox
    • js只能输入数字和带小数点的数字,兼容IE和firefox
    • 如何设置DIV层显示在flash对象之上,兼容ie和firefox等浏览器
    • js屏蔽方向键,兼容IE和firefox
    • js获取滚动条距离浏览器顶部,底部的高度,兼容ie和firefox
    本站文章除注明转载外,均为本站原创或编译?;队魏涡问降淖?,但请务必注明出处。
    转载请注明:文章转载自 七星彩票平台
    本文标题:javascript获取鼠标当前位置(兼容IE和firefox)
    IT技术书籍推荐:
    计算机科学丛书:Php和Mysql Web开发(原书第4版)
    计算机科学丛书:Php和Mysql Web开发(原书第4版)
    Luke Welling (作者), Laura Thomson (作者), 武欣 (译者)
    《计算机科学丛书:Php和Mysql Web开发(原书第4版)》将PHP开发与MySQL应用相结合,分别对PHP和MySQL做了深入浅出的分析,不仅介绍PHP和MySQL的一般概念,而且对PHP和MySQL的Web应用做了较全面的阐述,并包括几个经典且实用的例子?!都扑慊蒲Т允?Php和Mysql Web开发(原书第4版)》是第4版,经过了全面的更新、重写和扩展,包括PHP 5.3最新改进的特性(例如,更好的错误和异常处理),MySQL的存储过程和存储引擎,Ajax技术与Web 2.0以及Web应用需要注意的安全问题。