jQuery - “等到准备好”?

发布于 2024-11-29 08:07:20 字数 346 浏览 0 评论 0原文

我的网站上有这个滑块:

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

它工作正常,但我不喜欢它的加载方式(您可以在准备好之前看到带有列表点的图像列表)。

有没有一种通用的方法可以绕过它?如何在后台加载滑块,以便用户在其完全加载之前看不到它(例如,当它在后台加载时,我可以显示 preloader.gif)。

我在考虑不透明度:0 &在 DOM 中的滑块之后使其淡出,但也许还有其他方法?

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 slider in DOM, but maybe there's other way?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

花辞树 2024-12-06 08:07:20

我倾向于使用以下模式:

// 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 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");
});
回眸一笑 2024-12-06 08:07:20

我会说应用 css

.anythingSlider
{
    display:none;
}

,然后在加载滑块后使用 jQuery 更改它。

I would say apply css

.anythingSlider
{
    display:none;
}

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

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文