开发者

jQuery - "wait until ready"?

开发者 https://www.devze.com 2023-03-27 19:19 出处:网络
I have this slider on my website: http://css-tricks.com/examples/AnythingSlider/ It works fine, but I don\'t like the way it loads (you can see list of the images with list dots before it is ready).

I have this slider on my website:

http://css-tricks.com/examples/AnythingSlider/

It works fine, but I don't like the way it loads (you can see list of the images with list dots before it is ready).

Is there a universal way of bypassing that? How to load the slider in the background so users don't see it UNTIL it's fully loaded (while it loads in the background I could display preloader.gif for example).

I was thinking about opacity: 0 & fading it after the s开发者_开发问答lider in DOM, but maybe there's other way?


I tend to use the following pattern:

// assumes slider is hidden
var imgCount = $("#slider img").length;
var loadCount = 0;
$("#slider img").one("load", function() {
    loadCount++;
    if(loadCount === imgCount) {

        // show slider once all images have loaded
        showSlider();
    }
}).each(function() {
    if(this.complete) $(this).trigger("load");
});


I would say apply css

.anythingSlider
{
    display:none;
}

and then change it with jQuery after the slider is loaded.

0

精彩评论

暂无评论...
验证码 换一张
取 消