javascript-jQuery hide()方法不会立即在IE8中生效？

我们所拥有的是一些通过jQuery垂直居中对齐的图像.我们想要发生的是在${document)上隐藏未对齐的图像(意思是未居中),然后运行在window.onload居中的功能,然后再显示图像.

加载页面后,图像会立即在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();
    });

解决方法:

您不能保证在页面中的内容显示之前就可以运行javascript.您只是做不到,而IE却是最糟糕的.

您有两种选择可以解决您的问题：

>使用CSS样式表规则,该规则最初会使图像隐藏,然后使用javascript仅显示对齐的图像.
>不要将未对齐的图像放入DOM中-只能放入对齐的图像.这可能需要更改页面HTML的工作方式.图片可能位于javascript数组中,您可以通过JS加载图片,然后仅插入将对齐的图片.
>隐藏图像容器,直到您运行JavaScript并清除未对齐的图像为止.

如果您关心的是没有javascript的网站,则可能还希望以< noscript>使用< style>中的CSS规则标记标签

标签：show-hide,css,javascript,jquery,internet-explorer-8
来源： https://codeday.me/bug/20191208/2088143.html