`
琉璃月
  • 浏览: 43055 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论
阅读更多
当我们单击或移动鼠标时,一般都需要获得鼠标位置,其位置可分为Client(客户工作区)、Page(页面)和Screent(屏幕)3种。其中:
    Client是客户浏览器的工作区域,初始位置为(0,0)。
    Screent则是整个屏幕,初始位置在屏幕最上角。
    Page则在针对于页面内容的最上角进行定位,和网页内容相关。

以下为Event定位属性

属性名                  说明
ClientX和ClientY        光标相对于浏览器工作区域的水平和垂直位置(像素)
screenX和screenY        光标相对于屏幕的水平和垂直位置(像素)
pageX和pageY(FF)      光标相对于事件所在的文档的水平和垂直位置(像素)
OffsetX和OffsetY        光标相对于事件所在元素的最近已经定位的元素内边界位置
X和Y(IE)              光标相对于目标事件的父元素的外边界在X/Y坐标上的位置
layerX和layerY(FF)    光标相对于事件所在的元素的最近已经定位的元素外边界位置

    ClientX和ClientY、screenX和screenY 两队属性没有什么好讲的。在Moziilla中,pageX和pageY是相对于页面初始位置的定位,而它的layerX和layerY则是先在鼠标单击元素及其父元素中找到最近镜像绝对定位的元素,然后相对于该元素的为边界来定位。如果没有找到,就相对于body来定位,这时它与pageX和pageY的定位相同。

    在IE中,其OffsetX和OffsetY和Mozilla中的layerX和layerY相似,不同之处在于OffsetX和Offset是采用元素内边框作为起初位置,而layerX和layerY采用外边框作为起始位置,他们相差一个边框。IE中的X/Y在文档中解释为“以最近定位的元素作为定位”。但是在测试过程中,它和pageX/pageY相似,不过它不计算其Scroll内容的宽度,而pageX和pageY计算。

    
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics