zoukankan      html  css  js  c++  java
  • JS:offsetParent

    在td中的元素会把第一个绝对/相对定位的hierarchy parent当作offsetParent,如果没有找到需要分三种情况讨论

      一,如果该元素没有绝对/相对定位,则会把td当作offsetParent

      二,如果该元素绝对/相对定位并且table没有绝对/相对定位,则会把body当作offsetParent

      三,如果该元素绝对/相对定位并且table绝对/相对定位,则会把table当作offsetParent

    看一下示例代码

    1.<BODY >
    <TABLE BORDER=1 ALIGN=right>
       <TR>
         <TD ID=oCell><div id="parentdiv" style="position:relative" >parentdiv<div id="sondiv">sondiv</div></div></TD>
       </TR>

    </TABLE>

    </BODY>



    运行结果:parentdiv.offsetParent.tagName IS "body"

             sondiv.offsetParent.id     IS "parentdiv"

    2.<BODY >
    <TABLE BORDER=1 ALIGN=right>
       <TR>
         <TD ID=oCell><div id="parentdiv" style="position:relative" >parentdiv<div id="sondiv"  style="position:relative">sondiv</div></div></TD>
       </TR>

    </TABLE>

    </BODY> 


    运行结果: parentdiv.offsetParent.tagName IS "body"

              sondiv.offsetParent.id     IS "parentdiv"

    3.<BODY>
    <TABLE BORDER=1 ALIGN=right>
       <TR>
         <TD ID=oCell><div id="parentdiv" >parentdiv<div id="sondiv"  style="position:relative">sondiv</div></div></TD>
       </TR>

    </TABLE>

    </BODY> 



    运行结果:parentdiv.offsetParent.tagName IS "TD"

              sondiv.offsetParent.tagName    IS "body"

    4.<BODY >
    <TABLE BORDER=1 ALIGN=right>
       <TR>
         <TD ID=oCell><div id="parentdiv" >parentdiv<div id="sondiv">sondiv</div></div></TD>
       </TR>

    </TABLE>

    </BODY> 



    运行结果: parentdiv.offsetParent.tagName IS "TD"

              sondiv.offsetParent.tagName    IS "TD"

    5.<BODY>
    <TABLE BORDER=1 ALIGN=right style="position:relative">
       <TR>
         <TD ID=oCell><div id="parentdiv" style="position:relative" >parentdiv<div id="sondiv"  style="position:relative">sondiv</div></div></TD>
       </TR>

    </TABLE>

    </BODY>


    运行结果: parentdiv.offsetParent.tagName IS "Table"

              sondiv.offsetParent.tagName IS "parentdiv"

    原文出处:http://villain564.javaeye.com/blog/370893

  • 相关阅读:
    centos 用户管理
    rsync 实验
    文件共享和传输
    PAT 1109 Group Photo
    PAT 1108 Finding Average
    PAT 1107 Social Clusters
    PAT 1106 Lowest Price in Supply Chain
    PAT 1105 Spiral Matrix
    PAT 1104 Sum of Number Segments
    PAT 1103 Integer Factorization
  • 原文地址:https://www.cnblogs.com/purplefox2008/p/1821363.html
Copyright © 2011-2022 走看看