用于背景图像的waitForImages [英] waitForImages for background-image

问题描述

这是我在浏览器检查器中找到的图像的一部分，我希望被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>

已经尝试过使用$('.jtpl-background-area')，$('.jqbga-container')或$('.jtpl-background-area，.jqbga-container，.jqbga-web--图片")，但结果相同，则不会触发".我认为它根本找不到该url上的图片...(或者我做错了什么，因为我是新手，也许是语法错误)?

现在我要怎么做才能使它识别出该图像是该url/background-image?知道我做错了什么吗?

$('.jtpl-background-area').waitForImages(true).done(function() {
    $('.jtpl-background-area').css('-webkit-animation', 'fadein 4s');
});

或

$(".jtpl-background-area jqbga-container jqbga-web-image").waitForImages(true).done(function() {
    $('.jtpl-background-area').velocity({ opacity: 1 },{ duration: 4000});
});

不工作.该页面正在加载-但完全没有背景图片. A

//        $(window).on('load', function() {
//        $(".jtpl-background-area").velocity({ opacity: 1 },{ duration: 3000});
//});

有效-但是bakgrounds弹出得太晚了.

解决方案

根据

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.

解决方案

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');
});

这篇关于用于背景图像的waitForImages的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！