• [转] offsetParent 到底是哪一个?


    正文

    不同情况

    • 没有已定位的父节点,且自身position:relative的DIV元素的offsetParent为BODY
    • 没有已定位的父节点,且自身position: absolute的DIV元素的offsetParent为BODY
    • 没有已定位的父节点,且自身position: fixed的DIV元素的offsetParent为BODY
    • 没有已定位的父节点,且自身position: static的DIV元素的offsetParent为BODY
    • 拥有一个已定位的父节点,且自身position:
      relative的DIV元素的offsetParent为其最近被定位的祖先
    • 拥有一个已定位的父节点,且自身position:
      absolute的DIV元素的offsetParent为其最近被定位的祖先
    • 拥有一个已定位的父节点,且自身position: fixed的DIV元素的offsetParent为BODY
    • 拥有一个已定位的父节点,且自身position:
      static的DIV元素的offsetParent为其最近被定位的祖先
    • 在table之内,td与table都没有定位,且自身position:
      relative的DIV元素的offsetParent为BODY
    • 在table之内,td与table都没有定位,且自身position:
      absolute的DIV元素的offsetParent为BODY
    • 在table之内,td与table都没有定位,且自身position:
      fixed的DIV元素的offsetParent为BODY
    • 在table之内,td与table都没有定位,且自身position:
      static的DIV元素的offsetParent为其最近的TD、TH元素
    • 在table之内,td相对定位,且自身position:
      relative的DIV元素的offsetParent为其最近的TD、TH元素
    • 在table之内,td相对定位,且自身position: absolute的DIV元素的offsetParent为BODY
    • 在table之内,td相对定位,且自身position: fixed的DIV元素的offsetParent为BODY
    • 在table之内,td相对定位,且自身position:
      static的DIV元素的offsetParent为其最近的TD、TH元素
    • 在table之内,table相对定位,且自身position:
      relative的DIV元素的offsetParent为其最近的TABLE元素
    • 在table之内,table相对定位,且自身position:
      absolute的DIV元素的offsetParent为其最近的TABLE元素
    • 在table之内,table相对定位,且自身position: fixed的DIV元素的offsetParent为BODY
    • 在table之内,table相对定位,且自身position:
      static的DIV元素的offsetParent为其最近的TD、TH元素

    总结

    1. position为fixed元素是没有offsetParent,但firefox统一返回body。
    2. position为absolute, relative的元素的offsetParent总是为其最近的已定位的元素,
      没有找最近的td,th元素,再没有找body。
    3. position为static的元素的offsetParent则是先找最近的td,th元素,再没有找body。
    4. body为最顶层的offsetParent。

    个人观点

    用的比较多的是在没有table的情况下。所以很好记得。

  • 相关阅读:
    【报名有奖】相约2020 RT-Thread 开发者大会RDC
    基于RT-Thread的人体健康监测系统
    RT-Thread的位图调度算法分析(最新版)
    QEMU让你无需开发板即可玩溜RT-Thread~
    WPF TreeView 控件 HierarchicalDataTemplate 绑定节点及自定义节点的 样式
    转载 Prism之使用EventAggregation进行模块间通信 (http://www.cnblogs.com/li-xiao/archive/2011/04/20/2022962.html)
    创建简单的WCF程序(计算器)
    Arcgis Javascript API 离线部署
    回调函数
    Zookeeper 详细介绍 尤其树形结构 (转)
  • 原文地址:https://www.cnblogs.com/chris-oil/p/6662254.html
Copyright © 2020-2023  润新知