Question

好的，所以我有一个Jquery插件，效果很好，除了它将所有图像放在彼此之上，直到插件完成加载，然后它们全部到位。有没有办法让第一个图像成为843 w 345 h大小的占位符，并将其加载隐藏，直到它们都准备就绪，这样我的页面网站不会向下扩展，然后在加载时备份。谢谢！

$(window).load(function(){
        $('#slide-me').carousel({
            style: 'fade',
            transitionSpeed: 'slow',
            carouselSpeed: 3500,
            arrows: true,
            buttons: false,
            buttonsTheme: 'lines',
            stopOnHover: false,
            carouselHeight: 'crop',
            carouselWidth: 'crop'
        });
    });

HTML

<div id="slide-me">
    <img src="/tour/images/bigslider1.jpg" />
    <img src="/tour/images/bigslider2.jpg" />
    <img src="/tour/images/bligslider3.jpg" />
    <img src="/tour/images/bligslider4.jpg" />
    <img src="/tour/images/bigslider5.jpg" />

</div>

Answer 1

试一试，为我工作：

$(function(){
   setTimeout(function(){
        $('#slide-me').carousel({
            style: 'fade',
            transitionSpeed: 'slow',
            carouselSpeed: 3500,
            arrows: true,
            buttons: false,
            buttonsTheme: 'lines',
            stopOnHover: false,
            carouselHeight: 'crop',
            carouselWidth: 'crop'
        });
},500);
    });

Answer 2

我实际上得到了这个答案，并希望分享以防任何人想要看到它。在我的CSS中，所有需要做的就是这个＃slide-me img {display：none; } ＃slide-me img：first-child {display：block; } 这允许首先显示第一个图像，并在加载脚本时隐藏其余图像。

Jquery滑块在使用占位符准备好时加载图像

2 个答案: