zoukankan      html  css  js  c++  java
  • event对象有关鼠标位置的属性clientX,screenX等

    screenX:鼠标在显示屏幕上的坐标。
    clientX:鼠标在页面显示区域的坐标。
    注:以上两个都是各浏览器通用的。
    ~~~当浏览器不是最大化时,浏览器的左边和屏幕的左边就不是重叠的了,此时 event.clientX 不等于 event.screenX;浏览器最大化时 可视区域的上边和屏幕的上边是不重叠的 所以此时event.clientY event.screnY并不相等

    pageX:FF特有,鼠标在页面上的位置,从页面左上角开始定位,这个可以很方便在整个页面上进行定位,IE没有直接替换的属性。

    layerX:FF特有,鼠标相对于“触发事件的元素的层级关系中离该元素最近的,设置了position的父元素”的边界的位置,从border的左上角开始定位,即如果这个父元素存在border,则坐标原点在border的左上角,而不是内容区域的左上角。
    ~~~在offsetParent的坐标系统中的坐标值

    x:IE特有,跟layerX一个效果,可作为layerX的直接替换属性。
    注:IE和FF的定位有个1px的差别,实际上,IE的定位从0开始,FF的定位从1开始,FF永远会比IE大1px,需要根据实际情况处理。


    offsetX:IE特有,鼠标相对于“触发事件的元素”的位置,从内容区域左上角开始定位,不是从border左上角开始!这个属性比较好用,用来判断鼠标点在一个元素中的哪个位置很方便,FF没有直接替换的属性。

    offsetLeft:这个属性不是事件对象的属性,而是DOM对象所有的,该属性表示的是DOM对象在“该DOM对象的层级关系中离该对象最近的,设置了position的父对象”中的位置,虽然话是这么说的,但是不同的浏览器效果不一样,FF中严格按上述说明执行,但是在IE6/7中,这个属性返回该DOM对象在其直接父对象中的位置,但是IE8改正了这个问题,不过IE8又有了一个新问题,其他的浏览器都是从父对象的内容区域的左上角开始定位,IE8确是从父元素的border的左上角开始定位,由于测试环境为IETester中的IE8,不能排除是IETester的问题。
    ~~~offsetX 到offsetParent的水平距离

    1.clientHeight, clientWidth:
    这两个属性大体上显示了元素内容的象素高度和宽度.理论上说这些测量不考虑任何通过样式表加入
    元素中的页边距,边框等.

    2.clientLeft,clientTop:
    这两个返回的是元素周围边框的厚度,如果不指定一个边框或者不定位改元素,他的值就是0.

    3.scrollLeft,scrollTop:
    如果元素是可以滚动的,可以通过这俩个属性得到元素在水平和垂直方向上滚动了多远,单位是象素.
    对于不可以滚动的元素,这些值总是0.

    4.scrollHeight,scrollWidth:
    不管有多少对象在页面上可见,他们得到的是整体.

    5.style.left:
    定位元素与包含它的矩形左边界的偏移量


  • 相关阅读:
    模拟赛T5 : domino ——深搜+剪枝+位运算优化
    校内模拟赛T5:连续的“包含”子串长度( nekameleoni?) —— 线段树单点修改,区间查询 + 尺取法合并
    C++[Tarjan求点双连通分量,割点][HNOI2012]矿场搭建
    C++二分图匹配基础:zoj1002 FireNet 火力网
    迭代加深搜索 C++解题报告 :[SCOI2005]骑士精神
    Linux 常用命令
    Microservices and exception handling in Java with Feign and reflection
    微服务摘要
    Javac编译与JIT编译
    GC调优思路
  • 原文地址:https://www.cnblogs.com/stephenykk/p/3100041.html
Copyright © 2011-2022 走看看