`
big_student
  • 浏览: 39781 次
  • 性别: Icon_minigender_1
  • 来自: 宝鸡
社区版块
存档分类
最新评论

jQuery定位IE9和IE10 BUG

阅读更多

遇到了一个很奇怪的问题:

在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.uploadify.js修复IE9 IE10浏览按钮点击无效的bug

    给予jQuery的文件上传插件:jquery.uploadify.js修复了IE9 IE10浏览按钮点击无效的bug;直接替换官网下载的jquery.uploadify.js文件即可使用。

    Jquery 解决IE6 Select 框总是在图层(div)的上面显示的BUG

    利用Jquery解决IE6下,Select的Z-index过高的BUG 经常有朋友下拉菜单被Select遮盖。可以用此方法解决!

    自写jQuery插件,实现简单网页遮罩层/弹出层功能,兼容IE6、IE7

    实现弹出网页遮罩层,可兼容IE6/IE7/IE+++等; 缩放浏览器时,内容狂始终居中; 有点小bug,在IE6下,遮罩层颜色没透明,屎黑色,等我有空完善下。

    uploadify.js修复IE9 IE10浏览按钮点击无效的bug

    基于jQuery的文件上传插件uploadify,修复了IE9 IE10浏览按钮点击无效的bug;直接替换官网下载的jquery.uploadify.js文件即可。

    jQuery ajaxFileUpload.js 插件 ie9 下bug 修复

    NULL 博文链接:https://jianweicao.iteye.com/blog/1660904

    jquery-1.8.3.min.js

    jQuery1.8.2在IE9中调用ajax失败的问题 jQuery1.7.1不能正确地设置IE7中克隆元素的tabindex属性 压缩的JS文件包含非ASCII字符 如果body样式设置为display:none,则$('body')。show()无法工作 在IE9中element.css...

    jquery.winResize.js 解决ie的resize事件的bug

    ie的resize事件只要拖拽不放手就会一直执行很多很多遍的resize事件。需要用到这个js就能解决这个bug啦

    jquery validate在ie8下的bug解决方法

    项目用到了jquery的表单校验插件validate,但在ie8下有bug,下面有个不错的解决方法,需要的朋友可以参考下

    Bootstrap-datetimepicker先天bug修复,兼容IE6+

    Bootstrap-datetimepicker先天bug修复,兼容IE6+

    jquery-1.7.2.js免费下载

    Query 1.7.2正式版发布。...jQuery 1.7 版本加入了新的事件API .on() 和 .off(),提高了性能,以及为旧版IE浏览器提供了更好的HTML5支持。 同时 Google 及 Microsoft CDN 上的新版本也应该会在一两天内部署完毕

    jQuery 1.7.2 正式版, jquery 1.7.2 min.js

    jQuery 1.7.2正式版发布。...jQuery 1.7 版本加入了新的事件API .on() 和 .off(),提高了性能,以及为旧版IE浏览器提供了更好的HTML5支持。 同时 Google 及 Microsoft CDN 上的新版本也应该会在一两天内部署完毕。

    Jquery1.8 chm

    2012年11月14日 jQuery 1.8.3 发布,修复 bug 和性能衰退问题  IE8中的HTML相关Bug  jQuery 1.8.2在IE9中调用ajax失败的问题  jQuery 1.7.1不能正确地设置IE7中克隆元素的tabindex属性  压缩的JS文件包含非ASCII...

    jquery 最新版框架下载(1.32-1.8.2)

    jQuery 1.5.1 发布,全面支持IE9 jQuery 1.5.1发布了!这是自jQuery1.5发布以来第一个小版本更新,并且解决了很多BUG。 据jQuery官方博客5月3日的最新消息,jQuery 1.6 正式版已经可以下载使用。jQuery 1.6 版本...

    jquery 最新版框架下载(1.32-1.8.3)

    jQuery 1.5.1 发布,全面支持IE9 jQuery 1.5.1发布了!这是自jQuery1.5发布以来第一个小版本更新,并且解决了很多BUG。 据jQuery官方博客5月3日的最新消息,jQuery 1.6 正式版已经可以下载使用。jQuery 1.6 版本...

    jQuery 1.5.1 发布,全面支持IE9 修复大量bug

    我们非常感谢如下的贡献者(Contributors),他们为此次的发布提供了很多补丁(Patches):antonkovalyov, csnover, danheberden, ...和通常一样,我们提供两份jQuery的拷贝。一个压缩版本一个非压缩版本(分别

    jQuery v2.0.2正式版

    jQuery是一个快速简洁的javaScript库,极大地简化了JavaScript 编程。它能够快速方便的处理HTMLdocuments、events、实现动画效果并且为网站...4. jQuery 2.0 不再支持IE 6/7/8。 不知道能不能用哦,大家下载试试吧。

    jQuery改写上一个城市的三级联动(解决浏览器兼容bug)

    这个项目改进了上一个项目的不同,使用轻量的jQuery技术编写js的核心代码,不存在浏览器兼容的问题(本人亲测:IE、opera、火狐、google),而且代码更加简化和逻辑化;核心代码的编写采用了jQuery中提供的三种ajax...

    jQuery技术内幕:深入解析jQuery架构设计与实现原理

    程序运行在机顶盒中间件供应商提供的一款定制浏览器上,在开发过程中,发现这款浏览器的行为类似于古老的IE 5,各种缺陷和bug折磨得笔者苦不堪言,所以希望引入jQuery作为基础库,并开发一些通用组件和接口来简化...

    jquery v1.9.1 免费版

    和 .animate() 中使用 CSS 属性时,jQuery 会自动根据浏览器类型来设置一些前缀,例如 .css("user-select", "none") 在 Chrome/Safari 会变成 "-webkit-user-select", 在 Firefox 变成 "-moz-user-select", 在 IE10 ...

    jQuery 1.6.3正式版发布

    该版本是1.6主线上的最新版本,主要修复了大量的BUG。包括: BUG修复列表: Ajax #9255:修复webkit内核浏览器中jQuery.parseXML不能处理异常的问题。 #9854:Pass statusText through instead of “normalizing...

Global site tag (gtag.js) - Google Analytics