zoukankan      html  css  js  c++  java
  • 对js offset位置 宽高的理解

    clientTop,clientLeft:元素边框宽度。  clientWidth:元素width+元素padding。 offsetWidth:元素width+元素padding+元素边框宽

    offsetWidth,offsetHeight: 元素的可见宽度和高度。只跟该元素的本身有关

    offsetWidth=(border-width)*2+(padding-left)+(width)+(padding-right)

    offsetHeight=(border-width)*2+(padding-top)+(height)+(padding-bottom)

    offsetLeft,offsetRight:与offsetParent有关

    offsetLeft=(offsetParent的padding-left)+(中间元素的offsetWidth)+(当前元素的margin-left)。

    offsetTop=(offsetParent的padding-top)+(中间元素的offsetHeight)+(当前元素的margin-top)。

    offsetParent为body时情况比较特殊:

    在IE8/9/10及Chrome中,offsetLeft = (body的margin-left)+(body的border-width)+(body的padding-left)+(当前元素的margin-left)。

    在FireFox中,offsetLeft = (body的margin-left)+(body的padding-left)+(当前元素的margin-left)。

    offsetParent:

    1、如果当前元素的父级元素没有进行CSS定位(position为absolute或relative),offsetParent为body。

    2、如果当前元素的父级元素中有CSS定位(position为absolute或relative),offsetParent取最近的那个父级元素。

  • 相关阅读:
    第二次站立会议4
    第二次站立会议3
    建议总结
    对搜狗输入法的个人评价
    第二期站立会议10
    典型用户和用户场景描述
    第二期站立会议9
    第二期站立会议8
    第二期站立会议7
    第二期站立会议6
  • 原文地址:https://www.cnblogs.com/slb1994/p/6523099.html
Copyright © 2011-2022 走看看