防止图像在ie6和ie7中新加载时显示的javascript

我的html的结构基本上是：

<div id="featured">
  <a href=""><img src="" alt="" /></a>
  <div class="image-description">text</div>
</div>

我有一些javascript动态修改我的html，在除IE6和IE7之外的所有其他浏览器中都可以正常工作。它在IE8+中运行良好

在IE6和IE7中，它似乎阻止了图像的显示。我试着用web开发者工具在IE7中调试图像元素，但由于某种原因没有显示出来。我没有以任何方式修改css或js对图像元素或容器div的可见性或显示

通过注释我的javascript，我将其缩小为：

$featured = $('#featured');
// calculate var $desc_left now to eliminate/reduce description div "jumping"
var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
$featured.find('.image-description').css('left', $desc_left);
$featured.find('img').load(function() {
    // calculate var $desc_left again to make sure all browsers get the correct widths, like webkit browsers
    var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
    $featured.find('.image-description').css('left', $desc_left);
});

---

如果我继续重新加载页面，图像最终会出现。对这整件事的评论使IE7正常地显示图像。通过在更改js代码后删除所有浏览器历史记录/缓存进行测试。

这是暗中操作，但我自己在IE中也遇到过类似的情况

这可能与JavaScript执行时DOM没有及时下载图像有关。多次重新加载页面会强制DOM使用图像的缓存版本，这样它就可以正常工作

试试这个。

$（窗口）.load将在执行内部代码之前等待下载所有图像

$(window).load(function () {

    //  the following is all of your jQuery JavaScript that depends on your images being available.

    $featured = $('#featured');
    // calculate var $desc_left now to eliminate/reduce description div "jumping"
    var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
    $featured.find('.image-description').css('left', $desc_left);
    $featured.find('img').load(function() {
        // calculate var $desc_left again to make sure all browsers get the correct widths, like webkit browsers
    var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
    $featured.find('.image-description').css('left', $desc_left);
    });

});

$（窗口）.load
也可以嵌套在您的
$（文档）中。如果需要，准备好了
。
我不明白您试图用JavaScript做什么，而CSS是无法预先完成的。动态执行的是什么？为什么？如果启用了javascript，那么jQuery、Lightbox和其他插件都可用，它们需要特定的html格式。如果Javascript被禁用，那么我希望网站完全可访问。
$(window).load(function () {

    //  the following is all of your jQuery JavaScript that depends on your images being available.

    $featured = $('#featured');
    // calculate var $desc_left now to eliminate/reduce description div "jumping"
    var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
    $featured.find('.image-description').css('left', $desc_left);
    $featured.find('img').load(function() {
        // calculate var $desc_left again to make sure all browsers get the correct widths, like webkit browsers
    var $desc_left = ( ( $featured.width() - $featured.find('img').width() ) / 2 ) + 10;
    $featured.find('.image-description').css('left', $desc_left);
    });

});