JavaScript中event的x,clientX,offsetX的区别

  JavaScript中event的x,clientX,offsetX的区别

  请看下面的文字说明,也就是event中x,clientX,offsetX,screenX的区别:

  x:设置或者是得到鼠标相对于目标事件的父元素的外边界在x坐标上的位置。www.mlybyby.com

  clientX:相对于客户区域的x坐标位置,不包括滚动条,就是正文区域。

  offsetx:设置或者是得到鼠标相对于目标事件的父元素的内边界在x坐标上的位置。

  screenX:相对于用户屏幕。

  同时你可以对比下面代码分析

  Click here to show.

时间: 2024-10-12 10:48:10

JavaScript中event的x,clientX,offsetX的区别的相关文章

在javascript中event的target和currentTarget的区别

JavaScript的event对象中 event.target指代的是:触发事件的元素 event.currentTarget指代的是:事件绑定的元素 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div

【转】一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别

转自:http://www.2cto.com/kf/201409/333401.html 总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀....) 先总结下区别: event.clientX.event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性 event.pageX.event.pageY

轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别

总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕 先总结下区别: event.clientX.event.clientY 鼠标相对浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性 event.pageX.event.pageY 类似于event.clientX.event.clientY,但它们使用的是文档坐标而非窗口坐标.这2个属性不是标准属性,但得到了广泛支持.IE

js event对象的clientX,offsetX,screenX和pageX的区别

总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀....) 先总结下区别: event.clientX.event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性 event.pageX.event.pageY 类似于event.clientX.event.clientY,但它们使用的是文档坐标而非

【好文收藏】javascript中event对象详解

event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromElement 和 toElement 属性只对 onmouseover 和 onmouseout 事件有意义. 例子 下面的例子检查鼠标是否在链接上单击,并且,如果shift键被按下,就取消链接的跳转. <HTML> <HEAD><TITLE>Cancels Links</T

javascript中event对象详解

event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromElement 和 toElement 属性只对 onmouseover 和 onmouseout 事件有意义. 例子 下面的例子检查鼠标是否在链接上单击,并且,如果shift键被按下,就取消链接的跳转. 前端UI资源I分享 <HTML> <HEAD><TITLE>Cancels L

jQuery和javascript中event属性

javascript中event属性说明 1.altKey 描述: 检查alt键的状态. 语法: event.altKey 可能的值: 当alt键按下时,值为 TRUE ,否则为 FALSE .只读. 2.button 描述: 检查按下的鼠标键. 语法: event.button 可能的值: 0 没按键 1 按左键 2 按右键 3 按左右键 4 按中间键 5 按左键和中间键 6 按右键和中间键 7 按所有的键 这个属性仅用于onmousedown, onmouseup, 和 onmousemov

js防止回车(enter)键提交表单及javascript中event.keycode

如何防止回车(enter)键提交表单,其实很简单,就一句话.onkeydown="if(event.keyCode==13)return false;"把这句写在from标签里面就好了. 如果在页面中按Enter键会自动提交的话,可以设置返回值防止自动提交如<input id="q" name="q" type="text" onkeypress="javascript:return gosearch();&q

javascript中apply、call和bind的区别,容量理解,值得转!

a)  javascript中apply.call和bind的区别:http://www.cnblogs.com/cosiray/p/4512969.html b)  深入浅出 妙用Javascript中apply.call.bind   http://www.admin10000.com/document/6711.html ====================================================== 在JS中,这三者都是用来改变函数的this对象的指向的,他们