jQuery - 等到背景图像加载然后显示元素

时间:2011-04-15 18:48:16

标签: jquery background load wait

我确实找到了一些被告知如何做到这一点的地方,但它要么非常不方便,要么就是没有工作......(这些家伙自己的例子没有用......)

基本上我有背景图片,我想同时显示,而不是让他们随时加载到文档...

我不一定需要首先加载它们或任何,但要等到特定的背景图像加载然后显示它们的父div ..

此外,如果它可能......如果这些背景图像可以定义为通过类加载而不是指定实际图像名称,那将会产生很大的不同......如

.load-bg~background load~show element ..

我到达月球还是可行的?

3 个答案:

答案 0 :(得分:8)

我的插件waitForImages允许您在加载图片时附加回调。

它支持CSS中引用的图像。

$('#some-container').waitForImages({
    waitForAll: true,
    finished: function() {
        // Loaded all images referenced in CSS.
    }
});

答案 1 :(得分:1)

您可以使用异步图像加载器对事件进行回调,该事件显示保存图像的div。以下是一些异步加载器:

此外,SO q / a可能会有所帮助:Preloading images with jQuery

答案 2 :(得分:0)

我可以确认' ImagesLoaded'插件适合我。

像这样使用:

// jQuery
$('#container').imagesLoaded( { background: true }, function() {
  console.log('#container background image loaded');
});

// vanilla JS
imagesLoaded( '#container', { background: true }, function() {
  console.log('#container background image loaded');
});