jQuery定位IE9和IE10 BUG
程序员文章站
2022-07-14 13:08:25
...
遇到了一个很奇怪的问题:
在IE9和IE10中,当对一个html的样式初始了一个很大的left或者top时,使用jQuery的offset()或者jQuery UI的position重新定位会出现left或者top计算错误,造成元素离正确的位置很远。看例子:
<body style="overflow: hidden"> <div id="window" style=" display: block; position: absolute; left:214749px; top:127px;padding: 0; overflow: hidden; height: 400px; width: 800px; z-index: 10000;border:1px solid red"> </div> <script> $(function(){ $("body").height($(window).height()).width($(window).width()); $("#window").offset({left:282, top:127}); }) </script>
发现window的left为-429214.73px,而如果使用css方法不会有问题,即 $("#window_1").css({left:"282px", top:"127px"}); 如果将其中的left:214749px改为214748px则可定位成功。
问题原因:
调试了jQuery源代码发现是window.getComputedStyle(elem, null)在IE9和IE10中对left和top设置了大于214748的值时,getComputedStyle会返回错误的计算结果,造成jquery的offset方法错误,如果你使用了jQuery ui的position方法,因为offset方法的问题今儿引起position定位错误问题。
结论:
该bug是ie9和ie10对定位过大的设置getComputedStyle返回错误的大小引起的。
推荐阅读
-
基于JQuery和原生JavaScript实现网页定位导航特效
-
jquery的clone方法教程应用于textarea和select的bug修复
-
jQuery定位IE9和IE10 BUG
-
jQuery定位IE9和IE10 BUG
-
jquery.uploadify.3.2.1试用在IE9,IE10中上传文件的按钮会无法点击如何解决
-
基于JQuery和原生JavaScript实现网页定位导航特效
-
jquery的clone方法教程应用于textarea和select的bug修复
-
jquery.combobox中文api和例子,修复了上面的小bug_jquery
-
jQuery学习总结之元素的相对定位和选择器(持续更新)_jquery
-
jquery的相对父元素和相对文档定位示例代码_jquery