播放/暂停切换按钮jquery幻灯片

时间:2013-11-14 21:55:49

标签: jquery slideshow

我制作了幻灯片,但是我在添加暂停/播放切换按钮时遇到问题。知道我做错了什么吗?该按钮未正确切换或暂停幻灯片放映。

这是我的jsfiddle:http://jsfiddle.net/L7yKp/103/

这是我遇到问题的部分:

  $('#stop').click( function() {
         stop();
         showPlay();
         } );

  $('#play').click( function() {
         start();
         showPause();
         } );

   function showPause() {
      $('#play').hide();
      $('#stop').show();
       }

    function showPlay() {
       $('#stop').hide();
       $('#play').show();
       }

1 个答案:

答案 0 :(得分:1)

以下是使用变量stop的一个示例。

http://jsfiddle.net/L7yKp/104/

初始化stop变量

var stop = false;

如果单击停止button,则将stop设置为true。

$('#stop').click( function() {
    stop = true;
    //stop();
    showPlay();
} );

如果点击了游戏button,则将stop设置为false并调用runSlideShow()开始幻灯片放映。

 $('#play').click( function() {
    stop = false;
    runSlideShow();
    showPause();
 } );

slideShow函数中,如果stop为true,则return false会停止运行该函数。从而停止幻灯片放映。

var slideShow = function(){
    if(stop)
        return false;
    ....
}

不是从页面加载的那一刻开始运行幻灯片,而是调用showPlay(),以便隐藏暂停按钮,并且在点击之前幻灯片不会启动。

showPlay();
//runSlideShow();

希望这个例子能让你开始并给你一个想法。这只是你能做到的很多方法之一。