getBoundingClientRect可以获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置，最早在IE中实现，后其它浏览器均已实现。

但它在IE9,10中有个bug，当出现垂直滚动条时，获取top总为0。其它浏览器则能正常获取。代码如下

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8"/>

		<title>IE9/10 getBoundingClientRect bug</title>

	</head>

	<body style="height:3000px">

        <p style="margin-top:400px">

		<label>Top：<input id="_bound" type="text"/></label>

        </p>

    	<script>

            var el = document.getElementById('_bound')

            document.onclick = function() {

                var rect = document.documentElement.getBoundingClientRect()

                el.value = rect.top

            }

    	</script>

	</body>

</html>

1. 把body设的较高，以出现垂直滚动条

2. 鼠标向下拖动滚动条大概200px

3. 点击页面任意处，通过getBoundingClientRect获取input元素的top

Firefox/Chrome/Safari/IE11：-212~278

IE9/10：0

点击试试看，可以看到在IE9/10下一直为0

Input Top:

相关：

http://msdn.microsoft.com/en-us/library/ms536433(VS.85).aspx

http://developer.mozilla.org/en/docs/DOM:element.getBoundingClientRect

http://ejohn.org/blog/getboundingclientrect-is-awesome/

getBoundingClientRect在IE9/10里的bug的更多相关文章

  1. ie9,10 uploadify cleanUp bug

    起因:ie多次加载uploadify3.2版本这个组件的时候,出现了SCRIPT5007: 缺少对象．  From:http://blog.163.com/xiangfei209@126/blog/s ...

  2. IE9,10中console对象的bug

    首先上一段很简单的代码 <!DOCTYPE html> <html> <head> <title></title> <meta htt ...

  3. Cocos2d-JS V3.10 一个小bug提示

    感谢读者古事东流反馈,新版V3.10的音乐播放接口存在一个bug. 重复播放一个音乐,会出现音乐停止的状况. debug了一下,发现src的对比有点问题.传入的url是相对路径,但背景bgMusic. ...

  4. jdk 10.0.2 bug修复

    之前记录过jdk9+版本的1个bug,某些情况下会导致方法执行二遍,今天早上打开笔记本(mac),弹出一个框提示jdk升级10.0.2,顺手点了一下,然后验证了下该bug,发现居然fix掉了,推荐大家 ...

  5. SWFupload在IE9以上中的bug

    这几天在做图片上传的东西,是用swfupload是出现了再IE9下那选择文件的按钮无法点击的情况,在其他浏览器,例如Firefox.chrome都不会出现,后来google一下才发下这算是IE9以上和 ...

  6. Top 10 Open Source Bug Tracking System系统

    Bugzilla http://www.bugzilla.org/ Mantis php http://www.mantisbt.org/ Trac Python also provides wiki ...

  7. KBMMW 4.93.10 win64 一个BUG 修正

    经常有人提到kbmmw 4.93.10 的64 位版本没有32位版本稳定. 经过官方确认,是delphi 编译器生成64 位代码内存偏移地址的错误. 在kbmMWGlobal.pas 中 有一个函数k ...

  8. SWFUpload 在ie9上出现的bug

    SWFUpload 在ie9下会出现js错误 参考以下几个网址,备忘: http://code.google.com/p/swfupload/issues/detail?id=348 http://c ...

  9. 【10.14】Bug Bounty Write-up总结

    我很喜欢今天的看到的write-up,因为作者是针对他对一个网站整体进行漏洞挖掘的过程写的,内容包括几个不同的漏洞,从中能够学习到怎样系统性的挖掘漏洞. write-up地址:[Bug bounty ...

随机推荐

  1. 【原创】网站抓包HttpWebRequest不返回Javascript生成的Cookie的解决办法

    前言: 最近在做中国移动爬虫的过程中,首先遇到的就是 在某个请求中,有一个名为“WT_PFC"的cookie键值是由前端JavaScript生成的,没有进入到HttpWebResponse中 ...

  2. 一些JavaScript题目

    在JavaScript中,运行下面代码,sum的值是(). var sum=0;for(i=1;i<10;i++){if(i%5==0)break;sum=sum+i;} A. 40B. 50C ...

  3. C# 通用验证类 支持 WPF,MVC,Winform

    验证方式,   通过继承 IDataErrorInfo接口 和 DataAnnotations 解释标记语言而实现, 为了能在WPF上通用,所了也要继承属性更改通知接口INotifyPropertyC ...

  4. LeetCode2：Median of Two Sorted Arrays

    题目: There are two sorted arrays A and B of size m and n respectively. Find the median of the two sor ...

  5. 在MVC中应用百度富文本编辑器

    1.下载.NET版本的百度富文本编辑器,前往 下载.NET版本百度富文本框 2.解压下载的.zip压缩包,将utf8-.net文件夹名称改为:ueditor,复制到MVC根目录下面.结构如下: App ...

  6. （旧）子数涵数·DW——图文混排页面

    一.首先,打开Dreamweaver,新建一个的HTML项目. 二.在设计区里,写一些文字,随便写一点(也可以在代码区中的<body>和</body>之间写). 三.插入一张图 ...

  7. MAC 隐藏文件的显示

    显示 defaults write com.apple.finder AppleShowAllFiles -bool true 隐藏 defaults write com.apple.finder A ...

  8. 【译】Dependency Injection with Autofac

    先说下为什么翻译这篇文章,既定的方向是架构,然后为了学习架构就去学习一些架构模式.设计思想. 突然有一天发现依赖注入这种技能.为了使得架构可测试.易维护.可扩展,需要架构设计为松耦合类型,简单的说也就 ...

  9. [经验][JS]如何观察网站，进而模仿

    应该存在着一类人: 1.看到美丽的网站时,就会F12,看看他是怎么实现的 2.看到网站数据是自己需要的时候,就会F12,看看他是怎么拿到数据的 3.看到网站一个有趣的模块时,,就会F12,看看他是怎么 ...

  10. SQL Server Merge语句的使用

    Merge关键字在SQL Server 2008被引入,它能将Insert,Update,Delete简单的并为一句.MSDN对于Merge的解释非常的短小精悍:”根据与源表联接的结果,对目标表执行插 ...