Question

我希望在使用CSS（display：none;）隐藏在页面加载时淡入一些图像这适用于Firefox，Chrome，Safari，正常在Opera（最新版本：12.12）上，img随机显示......

这是Jquery代码：

$(document).ready(function () {
        $('img:hidden').load(function () {
            $('img:hidden').fadeIn(1000);
        });
    });

有人知道为什么它会在Opera上随机工作吗？

由于

Answer 1

首先，如果图像可见，“加载”事件会更好地触发。此外，根据我自己的经验，在某些情况下（例如IE），以下技巧有助于解决问题。

$(document).ready( function() {

  if ( $.browser.opera ) {
    $('img:hidden').each( function() {
      $('img:hidden').fadeIn(1000);
    });
  }
  else {
    $('img:hidden').load( function() {
      $('img:hidden').fadeIn(1000);
    });
  }

});

Answer 2

嗯，你真的不能错过jQuery Docu中的相应注释。 fontsize就像500px ...也许太大而无法识别？ ;-D

与图像一起使用时加载事件的注意事项

共同的挑战   开发人员尝试使用.load（）快捷方式解决问题是执行一个   当图像（或图像集合）完全存在时起作用   加载。应该有几个已知的警告   指出。这些是：

它不能始终如一地工作也不可靠   跨浏览器

如果图像src是，则在WebKit中无法正确触发   设置为与之前相同的src

它没有正确地冒泡DOM   树

对于已经存在于浏览器中的图像，可以停止触发   高速缓存

$（selector）.load的问题仅在Opera浏览器中随机工作

2 个答案: