Jquery document.ready 事件在我的元素 css 样式加载到 IE8 之前触发

标签 jquery css cross-browser

我在may页面有如下代码

var x = parseInt($(this).css('backgroundPosition').split(" ")[0]);

在 IE9 和 FF 和 Chrome 中一切正常,即使是 Iphone 但 IE8 和 IE7 抛出错误,我调试问题是 .css 方法无法解析该属性。

我在页面底部使用的 document.ready 函数似乎在将 css 应用于元素之前加载此代码,在这种情况下,这是一个 td 表元素

关于如何优雅地解决这个问题的任何想法

谢谢

最佳答案

我使用 jQuery 在 backgroundPosition(和 background-position)属性上得到了 undefined

如果您单独引用 X 和 Y,看起来确实可以在 IE 中访问 background-position 中的 X 和 Y:

<html>
<head>
<style type="text/css">
body {
    background: url(http://www.gravatar.com/avatar/e1122386990776c6c39a08e9f5fe5648?s=128&d=identicon&r=PG);
    background-repeat: no-repeat;
    background-position: 100px 500px;
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<p>Test of doc.ready and bg pos in IE8/9</p>
<script>
$(document).ready(function(){
    if ($.browser.msie) {
        console.log('X: ' + $('body').css('backgroundPositionX'));
        console.log('Y: ' + $('body').css('backgroundPositionY'));
    } else {
        console.log('X: ' + parseInt($('body').css('backgroundPosition').split(" ")[0]));
        console.log('Y: ' + parseInt($('body').css('backgroundPosition').split(" ")[1]));
    }
});
</script>
</body>
</html>

在 IE7/8 中(使用 IE9 控制台):

LOG: X: 100px 
LOG: Y: 500px 

http://jfcoder.com/test/bgpos.html

但是,它似乎在 Firefox 中不起作用(不输出任何内容)。所以我调整了检测IE的代码。

关于Jquery document.ready 事件在我的元素 css 样式加载到 IE8 之前触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7301787/

相关文章:

javascript - 当幻灯片处于事件状态时将 css 应用于祖 parent div

javascript - 使用 JavaScript 拦截所有文档链接点击

javascript - 使用 jQuery/JavaScript 将 Alpha channel 添加到背景颜色

html - 为什么我的div里面的内容会弹出来?

javascript - Cycle2 图像类别

javascript - getElementbyId 的函数数组

javascript - ActiveX 对象错误

css - 应该使用哪个属性来隐藏纯 CSS 中的下拉菜单?

javascript - 多个元素和多个事件的 jQuery 相同函数

javascript - ul-li。新的相等行(li),如下