显示加载程序图像,直到完全加载背景图像

Question

我正在尝试为背景图像实现一个加载器,直到整个图像使用jquery完全加载.我尝试了各种方法来做到这一点.由于图像是在CSS中指定的,因此我无法指定确切的图像ID或类.最后我最终这样做了,

$(window).load(function() {
   $(".loader").fadeOut("slow");
})

但这样做是在窗口加载时发生的.我希望在图像完全加载之前发生它.背景图片来自以下部分

<div class="loader"></div>
    <div class="test_banner services_banner">
</div>

如果有人帮助管理这个案子,那将会很棒.提前致谢.

Answer 1

也许你可以使用多个背景图像

例:

div {
  height:90vh;
    width:90vw;
  background:url(http://lorempixel.com/1200/800/nature/) center,
    url(http://www.jqueryscript.net/demo/Simple-Customizable-jQuery-Loader-Plugin-Center-Loader/img/loader1.gif) center center no-repeat ;/* this works once/untill image has been loaded */

<div></div>

Gif背景仍然留在这里,但画的是behi,d大图像.只要没有加载大图像就可以看到......