0

main.phpにロードされる一連のjqueryスライドショー（html）があります。私が必要としているのは、画像が完全にロードされない限り、スライドショーが画像のスライドを開始しないようにするために、スライドショーに非常に単純なプリロードを追加することです。各画像または「slideshow.html」全体をプリロードする必要がありますか？これはslideshow.htmlのコードです：

<body>
 <div id="slideshowContent">
            <img src="images/slideshows/grafica/lisyx_1.png" alt="Lisyx"  class="active"/>
            <img src="images/slideshows/grafica/lisyx_2.png" alt="Lisyx" />
        </div>
</body>

スライドの機能：

<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>

<script type="text/javascript">

function slideSwitch() {
    var $active = $('#slideshowContent IMG.active');

    if ( $active.length == 0 ) $active = $('#slideshowContent IMG:last');

    var $next =  $active.next().length ? $active.next()
        : $('#slideshowContent IMG:first');
    $active.addClass('last-active');

    $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, 1000, function() {
            $active.removeClass('active last-active');
        });
}

$(function() {
    slideshowInterval = setInterval( "slideSwitch()", 5000 );
});

</script>
4

1 に答える 1

2

ここで行っているのはyou are firing、上のslideSwitch()関数ですdoc ready

代わりに、クラス.preload(ajax ローダー イメージを持つ) を body またはページの body 要素のいずれかに追加できます。

これを試すことができます：

$(function() {
    $('body').addClass('preload'); // <---on doc ready preload will be added
    $(window).load(function(){
    $('body').removeClass('preload'); // <---after window fully loaded preload will be removed
       slideshowInterval = setInterval(slideSwitch, 5000 );
    });
});
于 2013-01-02T18:11:20.667 に答える