登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

zczhangchi 的博客

学习笔记

 
 
 

日志

 
 

js获取坐标  

2009-12-22 10:57:32|  分类: js资料 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

js获取坐标

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.getElementById(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);

function   getAbsPoint(e)  
{  
    var   x   =   e.offsetLeft,   y   =   e.offsetTop;  
    while(e=e.offsetParent)
    {
       x   +=   e.offsetLeft;  
       y   +=   e.offsetTop;
    }
    alert("x:"+x+","+"y:"+y);  
}

方法2:

function   getAbsPoint(obj)  
{  
   var   x,y;  
   oRect   =   obj.getBoundingClientRect();  
x=oRect.left  
y=oRect.top  
alert("("+x+","+y+")")  
}

JS中获得窗口属性的方法

1。获得屏幕的分辨率:
screen.width
screen.height

2。获得窗口大小:
document.body.clientWidth
document.body.clientHeight

3。获得窗口大小(包含Border、Scroll等元素)
document.body.offsetWidth
document.body.offsetHeight  

  评论这张
 
阅读(622)| 评论(0)

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018