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

我确实找到了一些地方告诉如何做到这一点,但它要么超级不方便或只是没有工作..(这些家伙自己的例子不起作用..)

基本上我有背景图像,我想同时显示,而不是让他们在他们取悦时加载到文档…

我不一定需要先加载它们,或者等到特定的背景图像加载然后显示它们的父div。

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

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

我到达月球还是可行的?

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

它支持CSS中引用的图像。

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

您可以使用异步图像加载器,其中包含对显示包含图像的div的事件的回调。 以下是一些异步加载器:

  • JAIL(jQuery异步图像加载器)
  • Image Loader JQuery插件
    • 注意:请参阅allcomplete事件。

此外,SO q / a可能会有所帮助: 使用jQuery预加载图像

我可以确认’ 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'); });