当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript 获取元素位置的快速方法 getBoundingClientRect()

Javascript
用js实现页面显示当前日期和时间的代码
ext监听事件方法[初级篇]
JavaScript面象对象设计
js当月水电气简单计算器
javascript 双色球对奖器
来自chinaz的ajax获取评论代码
用js写“算24”游戏的思路分析与实现代码
用js实现下载远程文件并保存在本地的脚本
用javascript获取textarea中的光标位置
js仿土豆视频滚动菜单
javascript 代码简单的管理菜单
js方块躲避游戏代码
js取得当前网址
获取当前网页document.url location.href区别总结
js刷新页面方法大全
JS处理VBArray的函数使用说明
一段利用WSH修改和查看IP配置的代码
一段利用WSH获取登录时间的jscript代码
JS启动应用程序的一个简单例子
不会死机的js 格式代码

Javascript 中的 javascript 获取元素位置的快速方法 getBoundingClientRect()


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 445 ::
收藏到网摘: n/a

有一种快速获得网页元素的位置。那就是使用getBoundingClientRect()方法。 它返回一个对象,其中包含了left、right、top、bottom四个属性,分别对应了该元素的左上角和右下角相对于浏览器窗口(viewport)左上角的距离。
所以,网页元素的相对位置就是
  var X= this.getBoundingClientRect().left;
  var Y =this.getBoundingClientRect().top;
再加上滚动距离,就可以得到绝对位置
  var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
  var Y =this.getBoundingClientRect().top+document.documentElement.scrollTop;
目前,IE、Firefox 3.0+、Opera 9.5+都支持该方法,而Firefox 2.x、Safari、Chrome、Konqueror不支持。