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. OpenProcess打开进程返回错误的问题

    问题描述 项目中需要做一个小功能:能够查看系统中当前正在运行的进程的内存信息,如内存块类型.分配状态.访问权限等.如下图所示: 需要的信息和上图相差无几.说起来也不算太难,毕竟现成的API已经提供了. ...

  2. 字符串hash + 二分答案 - 求最长公共子串 --- poj 2774

    Long Long Message Problem's Link:http://poj.org/problem?id=2774 Mean: 求两个字符串的最长公共子串的长度. analyse: 前面在 ...

  3. Redis持久化-数据丢失及解决

    Redis的数据回写机制 Redis的数据回写机制分同步和异步两种, 同步回写即SAVE命令,主进程直接向磁盘回写数据.在数据大的情况下会导致系统假死很长时间,所以一般不是推荐的. 异步回写即BGSA ...

  4. sql server2008安装错误（无法处理异常）

    我在安装sql server2008时出现安装错误,无法处理的异常,问题如下: 解决方法:在地址栏输入C:\Users\Administrator\AppData\Local ,找到Microsoft ...

  5. LeetCode129：Sum Root to Leaf Numbers

    题目: Given a binary tree containing digits from 0-9 only, each root-to-leaf path could represent a nu ...

  6. CSS基础选择器温故-1

    1.基本选择器语法 2.浏览器兼容性:浏览器对基本选择器都是一路绿灯通行,可以放心使用. 3.通配选择器:选择所有元素,也可以选择某个元素下的所有元素 (1)选择所有元素: *{margin: 0;p ...

  7. 用构造函数创建对象时的this的指向问题

    用构造函数方式创建对象: function Person(name,age){ this.name=name; this.age=age; this.sayname=function(){ alert ...

  8. JS中检测数据类型的四种方法

    1.typeof 用来检测数据类型的运算符->typeof value->返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."st ...

  9. 实验12：Problem D: 判断两个圆之间的关系

    Home Web Board ProblemSet Standing Status Statistics   Problem D: 判断两个圆之间的关系 Problem D: 判断两个圆之间的关系 T ...

  10. 2015年第12本（英文第8本）：the Old Man and the Sea 老人与海

    书名:The Old Man and The Sea(老人与海) 作者:Ernest Hemingway 单词数:2.7万 不重复单词数:2600 首万词不重复单词数:1500 蓝思值:940 阅读时 ...