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

Javascript
总结一些js自定义的函数
与ClientWidth有关的一点资料
对联广告 flash版
连接文字不停变色
一条一条新闻向上的滚动 不错
Ctrl + Enter提交前检测的代码
对联广告 可关闭
一些很实用且必用的小脚本代码
巧妙破除网页右键禁用的十大绝招
实用javaScript技术-屏蔽类
静态的动态续篇之来点XML
显示行号的文本输入框
仿DVBBS下拉菜单效果 修正无错
移到这里,就会自动点击
让iframe框架网页在任何浏览器下自动伸缩
[原创]用srcElement实现添加效果
Javascript客户端脚本的设计和应用
解决 FireFox 下[使用event很麻烦] 的问题.
打字效果
简单的防盗链功能代码(iframe)

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 191 ::
收藏到网摘: 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不支持。