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);  
  • 相关阅读:
    CF149D Coloring Brackets
    CF508D
    CF483C Diverse Permutation
    【纪念】我写过几乎最长的代码
    .net core图片上传详解
    layui插件croppers的使用
    关于日常操作中sql的性能
    leeCode 278
    leeCode刷题 1078
    leeCode刷题 lc184
  • 原文地址:https://www.cnblogs.com/icelab/p/6195402.html
Copyright © 2011-2022 走看看