Javascript自动播放幻灯片

Javascript autoPlay Slideshow

本文关键字：幻灯片自动播放 Javascript 更新时间：2023-09-26

我有一个小幻灯片。它与上一个和下一个按钮配合良好。但现在我想做一个幻灯片播放&暂停按钮。也许你有个主意？

javascript：

 function loadSlide(index){
    $('#gallery li').fadeTo(6000, 1.0);
        $('#gallery li').hide()
    .       eq(index).show();
        }
        $('#gallery').data('index',0).find('li').hide();
            loadSlide(0);
        $('#next').on('click',function(e){
          var index = $('#gallery').data('index'),
           numSlides = $('#gallery li').length;
          index = (index + 1) % numSlides;    
            loadSlide(index);
          $('#gallery').data('index',index);
            e.preventDefault();            
    });
        $('#previous').on('click',function(e){
         var index = $('#gallery').data('index'),
            numSlides = $('#gallery li').length;
            index = (index + numSlides - 1) % numSlides;
                loadSlide(index);
        $('#gallery').data('index',index);
            e.preventDefault();
    });
    $("#gallery li img").css({
                    'height':$("#gallery").height()+'px'
                });
                $("#gallery li").each(function(){
                    $(this).css({
                        'margin-left':'+'+parseInt($(this).children("img").width()/2)+'px'
                });
            });
            $("#gallery li img").css({
                    'height':$("#gallery").height()+'px'
                });
                $("#gallery li").each(function(){
                    $(this).css({
                        'margin-left':'+'+parseInt($(this).children("img").width()/2)+'px'
                });
            });
        }

提前感谢！

没有测试，但类似的东西应该可以工作：

$('#start').click( function(){
 t = setInterval( function(){ $('#next').trigger('click'), 2000 } );
});
$('#stop').click( function(){
 clearInterval(t);
});