zoukankan      html  css  js  c++  java
  • 获取元素相对于页面的位置 和 页面高度 和 页面滚动高度

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

    参考:

    http://apply-templates.com/en/blog?title=Finding%20element%20position%20in%20Javascript

    http://www.quirksmode.org/js/findpos.html

    http://www.codeproject.com/KB/scripting/dom-element-abs-pos.aspx

    // 获取元素相对于页面文档的位置----------------------------------------------
    function getElementPos(el) {
    	if(el.parentNode === null || el.style.display == 'none') {	return false;}     
    	var parent = null;
    	var pos = [];
    	var box;
    	if(el.getBoundingClientRect){     //IE
    		box = el.getBoundingClientRect();
    		var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
    		var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
    		return {x:box.left + scrollLeft, y:box.top + scrollTop};
    	
    	}else{ 
    		pos = [el.offsetLeft, el.offsetTop]; 
    		parent = el.offsetParent;    
    		if (parent != el) {
    			while (parent) { 
    				pos[0] += parent.offsetLeft;
    				pos[1] += parent.offsetTop;
    				parent = parent.offsetParent;
    			} 
    		}  
    	}  
    	return {x:pos[0], y:pos[1]};
    }	
    

    获取页面滚动大小高度 和 获取页面高度
    get the page height and the scroll amounts

    // getPageScroll() by quirksmode.com
    function getPageScroll() {
        var xScroll, yScroll;
        if (self.pageYOffset) {
          yScroll = self.pageYOffset;
          xScroll = self.pageXOffset;
        } else if (document.documentElement && document.documentElement.scrollTop) {
          yScroll = document.documentElement.scrollTop;
          xScroll = document.documentElement.scrollLeft;
        } else if (document.body) {// all other Explorers
          yScroll = document.body.scrollTop;
          xScroll = document.body.scrollLeft;
        }
        return new Array(xScroll,yScroll)
    }
    
    // Adapted from getPageSize() by quirksmode.com
    function getPageHeight() {
        var windowHeight
        if (self.innerHeight) { // all except Explorer
          windowHeight = self.innerHeight;
        } else if (document.documentElement && document.documentElement.clientHeight) {
          windowHeight = document.documentElement.clientHeight;
        } else if (document.body) { // other Explorers
          windowHeight = document.body.clientHeight;
        }
        return windowHeight
    }
    
  • 相关阅读:
    实体类实现序列化
    异常处理
    Springboot的模块化使用
    Springboot的开始
    RxJava用法
    okhttp的Post方式
    OKhttp使用
    soundPool声音池
    ScheduledExecutor定时器
    timer定时器
  • 原文地址:https://www.cnblogs.com/zsk526/p/2184307.html
Copyright © 2011-2022 走看看