问题
This is the part of the image I found with browsers inspector and I want to get recognized by waitforImages:
<div class="jtpl-background-area jqbga-container jqbga-web--image" background-area="" style="background-image: url('https://image.jimcdn.com/app/cms/image/transf/dimension=767x/path/s4354a59fbfee63e4/backgroundarea/ibb91266a7f033fa3/version/1529172695/image.jpg');background-position: 54.0833% 41.0025%;"></div>
Already tried it with $('.jtpl-background-area'), $('.jqbga-container') or $('.jtpl-background-area, .jqbga-container, .jqbga-web--image') but with the same result, it does not 'fire'. I think it simply does not find the picture on that url...(or I do something wrong as I am new to this stuff, maybe a syntax error)?
What do I have to do now, to get it recognizing that the image is that url/background-image? Any idea what I do wrong?
$('.jtpl-background-area').waitForImages(true).done(function() {
$('.jtpl-background-area').css('-webkit-animation', 'fadein 4s');
});
or
$(".jtpl-background-area jqbga-container jqbga-web-image").waitForImages(true).done(function() {
$('.jtpl-background-area').velocity({ opacity: 1 },{ duration: 4000});
});
Do not work. The page is loading - but without background-image at all. A
// $(window).on('load', function() {
// $(".jtpl-background-area").velocity({ opacity: 1 },{ duration: 3000});
//});
works - but bakgrounds popping up too late.
回答1:
According to the documentation, you need to enable an option for the plugin to scan for images in CSS properties.
Your code should be...
$('.jqbga-web--image').waitForImages(true).done(function() {
$('.jtpl-main').css('visibility', 'visible');
});
来源：https://stackoverflow.com/questions/48818369/waitforimages-for-background-image