zoukankan      html  css  js  c++  java
  • 关于offsetParent

    元素的offsetParent可能值:null,body元素,该元素的某个父级定位元素。

    为null的情况:

      1. body元素

      2. 元素的display为none

      3. 元素尚未添加到DOM

      4. 元素的position为fixed

    为body元素的情况:

      该元素不是任何一个定位元素的后代,也不是null。

    为某个父级定位元素的情况:

      如果此元素是某个定位元素的子级,离它最近的父级定位元素为此元素的offsetParent;如果此元素不是某个定位元素的子级,但其父元素中有td、th或者table,那么其offsetParent为上述元素。

    获取元素相对于页面的位置:

    function(elem) {
    	if (elem.getBoundingClientRect) { //HTML5 method
    		var box = elem.getBoundingClientRect();
    		var body = document.body;
    		var docElem = document.documentElement;
    		var scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop;
    		var scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft;
    		var clientTop = docElem.clientTop || body.clientTop || 0;
    		var clientLeft = docElem.clientLeft || body.clientLeft || 0;
    		var top  = box.top +  scrollTop - clientTop;
    		var left = box.left + scrollLeft - clientLeft;
    		return { y: Math.round(top), x: Math.round(left), elem.offsetWidth, height:elem.offsetHeight };
    	} else { //fallback to naive approach
    		var top=0, left=0;
    		while(elem) {
    			top = top + parseInt(elem.offsetTop,10);
    			left = left + parseInt(elem.offsetLeft,10);
    			elem = elem.offsetParent;
    		}
    		return { y: top, x: left, elem.offsetHeight, height:elem.offsetWidth };
    	}
    }
    

      

  • 相关阅读:
    Python中的除法
    使用Windows Live Writer 2012和Office Word 2013 发布文章到博客园全面总结
    单例模式(Singleton)的6种实现
    Linux关机命令总结
    Java中构造函数执行顺序的问题
    SVN四部曲之SVN命令精通
    SVN四部曲之SVN简单使用教程入门
    SVN四部曲之SVN使用详解进阶
    用正则表达式判断一个二进制数是否能被3整除
    栈帧%ebp,%esp详解
  • 原文地址:https://www.cnblogs.com/ywxgod/p/6481247.html
Copyright © 2011-2022 走看看