jQuery幻灯片放映下一页/上一页

jQuery Slideshow Next/Previous

本文关键字：一页 幻灯片 jQuery      更新时间：2023-09-26

我是jQuery的新手，我只是想知道创建下一个/上一个按钮以浏览幻灯片的最简单、最有效的方法。我的代码如下：

run=setInterval（"switchSlide（）"，2000）；$（document）.ready（function）{$（'#幻灯片img:gt（0）'）.hide（）；$（'#slideshow'）.hooper（function（）{clearInterval（运行）；}，函数（）{run=setInterval（"switchSlide（）"，2000）；})；$（'#play'）.click（function（）{run=setInterval（"switchSlide（）"，2000）；})；$（'#stop'）.click（function（）{clearInterval（运行）；})；$（'#previor'）.click（function（）{$（'#slideshow-img:first'）.fadeOut（1000）.preve（）.fadeIn（1000）.end（）.appendTo（'#slideshow'）；})；$（'#next'）.click（function（）{$（'#slideshow-img:first'）.fadeOut（1000）.next（）.fadeIn（1000）.end（）.appendTo（'#slideshow'）；})；})；函数开关Slide（）{$（'#slideshow-img:first'）.fadeOut（1000）.next（）.fadeIn（1000）.end（）.appendTo（'#slideshow'）；}

我假设next（）将为您获取下一个图像，因为这是您在switchSlide（）中所做的。您可以在HTML 中添加div元素

  <div id="next"></div>

然后附加一个点击事件，它将调用next（），本质上执行与switchSlide（）相同的操作

  $('.next').click(function(){ 
     $('#slideshow img:first').fadeOut(1000).next().fadeIn(1000).end().appendTo('#slideshow');
   })

以前的也可以这样做

相关文章：