首页 | 网页设计 | w3c标准 | flash动画 | 平面设计 | 经典文章 | 特约专题 | 资源下载 | 健康频道 | 重庆品牌网站 | 留言簿 | 
技术文章  资源下载 经典素材  社区论坛
   
 您现在的位置: vi设计在线 >> 经典文章 >> ccqvi动态 >> 技术应用 >> 正文  
  最新IT信息-如何获取网页中元素位置         
[ 作者:佚名    转贴自:本站原创    点击数:1233    更新时间:2010/7/9    文章录入:diyinetwork ]

减小字体 增大字体

如何获取网页中元素位置

重庆帝一网络建设专家 http://www.diy88.com.cn

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML> <HEAD> <TITLE> New Document
 </TITLE> <META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT="">
 <META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT="">
<script language="javascript" type="text/javascript">   <!--  
// 说明:用 javascript 获取指定页面元素的位置    
来自internet   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;                
parentparent = 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) { parentparent = parent.parentNode; } 
else { parent = null; }     }   return {x:pos[0], y:pos[1]};   }  
 function showDt(){      var pos=getElementPos("theDt");  
 var obj=document.getElementById("MydtGenerator");    
 var h=parseInt(document.getElementById("theDt").style.height);
obj.style.left=pos.x;   
obj.style.top=pos.y+h;   obj.style.display=''; 
 event.cancelBubble=true;      }    
//-->   </script>   </HEAD>  <BODY>   
<INPUT TYPE="text" style="height:25px;"
 NAME="theDt" id="theDt" onclick="showDt();">  
 <div id='MydtGenerator' style="width:
100;height:200px;border:solid 1px red; 
position:absolute;left:0;top:10; z-index:999; 
display:none;" onclick="javascript:
event.cancelBubble=true;">test</div>  </BODY> </HTML>

 

 上一篇文章: 最新IT信息-用Ext构建Web应用程序的客户端
 下一篇文章: 最新IT信息-是谁扼杀了应用开发?云计算是真正的凶手么
发表评论】【告诉好友】【打印此文】【关闭窗口


技术文章  资源下载
经典素材  社区论坛
 中大型美容美发店老…[1061]
 重庆多达学习俄语培…[2293]
 重庆恒祥广告有限公…[1991]
 重庆市南方阻燃电线…[2402]
 重庆舞美灯光音响有…[3146]
 重庆德鼎滤油机有限…[1909]
 重庆民生建材有限公…[2350]
 重庆集元科技有限公…[4129]
 重庆倍润商贸有限公…[2016]
 重庆腾达展览有限公…[3082]
 帝一网络创始人宣…--[3179]
 重庆vi设计在线祝…--[2741]
 重庆帝一网络书生…--[2855]
 馋嘴鸭的起伏和经…--[3001]
 机器感觉“卡”的…--[2930]
 ActionScript3打造…--[5765]
 在ASP文件中读取H…--[7240]
 vi设计经典案例--[63828]
 帅到掉渣-爆笑版勇…--[7066]
 一个女孩写的经典…--[6827]
没有相关文章
 (只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    没有任何评论
设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 重庆网站建设 | 
版权所有: vi设计在线  © 2005-2018 网站备案序号:渝ICP备06003824号
技术支持:帝一网络(重庆网站建设专家)