jQuery hide（）方法在IE8中不会立即生效？

我们有一些图像是通过jQuery垂直居中对齐的。我们想要发生的是在$(document).ready上隐藏未对齐的图像（意思是不居中），然后运行以window.onload为中心的函数，然后显示图像。jQuery hide（）方法在IE8中不会立即生效？

加载页面时，图像立即隐藏在Firefox和Chrome上。但在IE8中，短暂的一秒钟之后，它仍然在隐藏图像之前显示未对齐的图像。

有没有办法让IE8立即隐藏它们？以下是代码：

<script language="javascript" type="text/javascript"> 
$(document).ready(function() { 
    $('.img_mask img').hide(); 
}); 

window.onload = function() { 
    $('.img_mask img').each(function() { 
     var $img = $(this); 
     var h = $img.height(); 
     var w = $img.width(); 
     $img.css('margin-top', +h/-2 + "px").css('margin-left',+ w/ -2 + "px"); 
     $('.img_mask img').show(); 
    });

来源

2011-08-29 catandmouse

您不能保证JavaScript将在页面中的内容显示之前运行。你不能和IE是最糟糕的。

你有几个选项来解决问题：

使用CSS样式表规则，使隐藏最初的图像，然后使用JavaScript只显示对齐的。
请勿将错误排列的图像放在DOM中 - 只能放入对齐的图像。这可能需要更改页面HTML的工作方式。该图像可以在一个JavaScript数组中，并通过JS加载它们，并只插入将对齐的图像。
隐藏图像容器，直到你运行你的javascript并清除了错误对齐的图像。

如果你关心那些没有JavaScript的网站，你可能还需要在<style>标签

来源

2011-08-29 05:01:26 jfriend00

您可以使用.ready函数在加载时隐藏它，然后显示其他内容？

查找到的jquery。就绪（）函数...

http://api.jquery.com/ready/

有点像3nigma和.. jfriend所述...，设置元件具有一个初始显示：无;然后让它显示在事件或延迟...可以帮助顺利的事情？

来源

2011-08-29 04:58:43

的OP已经包裹内'ready'处理程序的代码看jfriend00答案 – Rafay

-1

尝试其他方法来加速选择器图像。

$('.img_mask').find('img').hide();

来源

2011-08-29 05:00:19 Rady

无法机制保障所显示的页面元素之前任何JavaScript运行的原因。 – jfriend00

您的逻辑需要改进。您应该先将img隐藏起来，然后再附加到DOM，等待条件满足再显示出来。

$('hiddenimg').hide().appendTo($(body)); 

window.onload = function() { 
    if (/*some conditions*/) { 
     $('hiddenimg').show(); 
    } 
}

来源

2011-08-29 05:00:30 wukong

你应该使用隐藏的display:none IMG使用CSS规则来显示在<noscript>标签最初隐藏图像或visibility:hidden像

.img_mask{ 
    visibility:hidden; 
}

之后使用.show()

来源

2011-08-29 05:01:45 Rafay

请问，如果你嵌入脚本我它的工作显示图片在声明最后一个项目后立即将HTML添加到HTML中？

<head> 
    <script type="text/javascript"> 
     window.onload = function() { 
      // Image aligning code goes here 
     } 
    </script> 
</head> 
<body> 
    <div class='img_mask'> 
     <img src="http://www.hollywoodgo.com/wp-content/uploads/2010/04/smurfs-movie-225x300.jpg" 
    </div> 

    <script type="text/javascript"> 
     $('.img_mask img').hide(); 
    </script> 
</body>

这适用于我，但我没有安装IE8来测试它。

我认为，最好是有在HTML中可见的图像，并通过脚本隐藏起来（因为你正在做的），而不是把他们隐藏在HTML，并通过脚本透露。

如果渲染设备已禁用脚本，最好是看不好对齐，然后不是在所有的图像。

来源

2011-08-29 05:04:39

$(document).ready(function() {}

document.ready（）函数的作用正如名称所暗示的那样。文档是指DOM或文档对象模型，而在这种情况下，“就绪”是指当DOM由浏览器注册时。因此，您的代码将等待，直到每件事情都准备就绪，并开始对其进行处理。这就是为什么你面临一些延迟。

来源

2011-08-29 07:07:05 Vins

jQuery hide（）方法在IE8中不会立即生效？

回答

相关问题