JavaScript获取元素的位置(受分辨率影响)的替代函数

不知道是受分辨率影响,还是在分辨率影响下,页面出现滚动条时,拖动了滚动条导致scroll值发生改变的影响。

 替代函数来自:http://www.cnblogs.com/Caceolod/articles/1312357.html

  1 /*
  2   获取某个元素的位置
  3   @obj 该元素的DOM对象,或该元素的ID
  4 */
  5 /* 
  6 下列这个函数虽然能获取到元素的位置,但是在分辨率不同的情况下,位置会不一致。
  7 function getObjectPosition(obj)
  8 {
  9   obj=typeof obj==='string'?getElement(obj):obj;
 10   if(!obj)
 11   {
 12     return;
 13   }  
 14   var position='';
 15   if(obj.getBoundingClientRect) //For IEs
 16   {
 17     position=obj.getBoundingClientRect();
 18     return {x:position.left,y:position.top};
 19   }
 20   else if(document.getBoxObjectFor)
 21   {
 22     position=document.getBoxObjectFor(obj);
 23     return {x:position.x,y:position.y};
 24   }
 25   else
 26   {
 27     position={x:obj.offsetLeft,y:obj.offsetTop};
 28     var parent=obj.offsetParent;
 29     while(parent)
 30     {
 31        position.x+=obj.offsetLeft;
 32        position.y+=obj.offsetTop;
 33        parent=obj.offsetParent;
 34     }
 35     return position;
 36   }
 37 }
 38 */
 39  function getObjectPosition(obj)
 40 {
 41     var ua = navigator.userAgent.toLowerCase();
 42     var isOpera = (ua.indexOf('opera'!= -1);
 43     var isIE = (ua.indexOf('msie'!= -1 && !isOpera); 
 44     var el=typeof obj==='string'?getElement(obj):obj;    
 45     if(el.parentNode === null || el.style.display == 'none'
 46     {
 47         return false;
 48     }         
 49     var parent = null;
 50     var pos = [];     
 51     var box;         
 52     if(el.getBoundingClientRect)    //IE
 53     {         
 54         box = el.getBoundingClientRect();
 55         var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
 56         var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
 57         return {x:box.left + scrollLeft, y:box.top + scrollTop};
 58     }
 59     else if(document.getBoxObjectFor)       
 60     {
 61         box = document.getBoxObjectFor(el); 
 62         var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0
 63         var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0
 64         pos = [box.x - borderLeft, box.y - borderTop];
 65     }
 66     else  
 67     {
 68         pos = [el.offsetLeft, el.offsetTop];  
 69         parent = el.offsetParent;  
 70        
 71         while (parent) 
 72         {  
 73             pos[0+= parent.offsetLeft; 
 74             pos[1+= parent.offsetTop; 
 75             parent = parent.offsetParent;
 76         }  
 77   
 78         if (ua.indexOf('opera'!= -1 || ( ua.indexOf('safari'!= -1 && el.style.position == 'absolute' )) 
 79         { 
 80             pos[0-= document.body.offsetLeft;
 81             pos[1-= document.body.offsetTop;         
 82         }    
 83     } 
 84                  
 85     if (el.parentNode) 
 86     { 
 87         parent = el.parentNode;
 88     } 
 89     else 
 90     {
 91         parent = null;
 92     }
 93     
 94     while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML'
 95     { 
 96         pos[0-= parent.scrollLeft;
 97         pos[1-= parent.scrollTop;
 98         
 99         if (parent.parentNode) 
100         {
101             parent = parent.parentNode;
102         } 
103         else 
104         {
105             parent = null;
106         }
107     }
108     
109     return {x:pos[0], y:pos[1]};
110 }
<h3>
   心静似高山流水不动,心清若巫峰雾气不沾。
</h3>
原文地址:https://www.cnblogs.com/McJeremy/p/1517698.html