页面不总是在加载图像时检测到

Question

我有一个使用Twitter Bootstrap的Ruby on Rails应用程序。

在页面上，有一个使用大图像的轮播。因为在此，我在页面上显示加载GIF，直到所有图像都被加载。

所以，最初，有GIF

<div id="loading-div" class="centered">
    <img src="<%= asset_path("page-loader.gif") %>" />
</div>

页面加载后，我们隐藏轮播，等待其中一个图像加载，然后隐藏GIF并显示轮播。但有时，会调用onload事件。例如。当我已经访问过该页面并在其他地方导航时，再次导航到旋转木马页面。

这是JavaScript：

$('#home-carousel').hide();
$('#first-image').load(function(){
    $('#loading-div').fadeOut(function(){
        $('#home-carousel').fadeIn();
    });
});

是否有重新检查图像是否已加载？如果是这样，不要显示GIF？

是否可能在为传送带和图像设置“onload”和“hide（）”之前加载图像？

处理这种情况的最佳方法是什么？

感谢您的时间。