zoukankan      html  css  js  c++  java
  • JavaScript通过ID获取元素坐标

    JavaScript通过ID获取元素坐标

    function getElementPos(elementId) {  
     var ua = navigator.userAgent.toLowerCase();  
     var isOpera = (ua.indexOf('opera') != -1);  
     var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof  
     var el = document.getElementByIdx_x_x(elementId);  
     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 if(document.getBoxObjectFor)    // gecko      
     {  
      box = document.getBoxObjectFor(el);   
      var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0;   
      var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0;   
      pos = [box.x - borderLeft, box.y - borderTop];  
     } else    // safari & opera      
     {  
      pos = [el.offsetLeft, el.offsetTop];    
      parent = el.offsetParent;       
      if (parent != el) {   
       while (parent) {    
        pos[0] += parent.offsetLeft;   
        pos[1] += parent.offsetTop;   
        parent = parent.offsetParent;  
       }    
      }     
      if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' )) {   
       pos[0] -= document.body.offsetLeft;  
       pos[1] -= document.body.offsetTop;           
      }      
     }                
     if (el.parentNode) {   
        parent = el.parentNode;  
       } else {  
        parent = null;  
       }  
     while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML') { // account for any scrolled ancestors  
      pos[0] -= parent.scrollLeft;  
      pos[1] -= parent.scrollTop;  
      if (parent.parentNode) {  
       parent = parent.parentNode;  
      } else {  
       parent = null;  
      }  
     }  
     return {x:pos[0], y:pos[1]};  
    }  
      
    //sample  
    var pos=getElementPos("divId");  
    alert("距左边距离"+ pos.x +",距上边距离"+pos.y);  
  • 相关阅读:
    练习2-15 求简单交错序列前N项和(15 分)
    js预解析实例
    one:arguments对象伪数组
    第一章 评估工具
    第6章条件处理
    第五章----过程
    第4章 数据传递.寻址和算术运算
    第3章 汇编语言基础
    第2章-------------IA-32处理器体系结构
    第一章-------基本概念
  • 原文地址:https://www.cnblogs.com/icelab/p/6195402.html
Copyright © 2011-2022 走看看