-5

请我需要一些有关我的 jquery 代码流程的帮助。我已经让幻灯片工作了，并决定更进一步，添加导航按钮/图像。

在下面的代码中，我先用一个 div 对其进行测试，该 div 稍后将成为图片或按钮。无论如何，我有它，所以当我单击 div 时，幻灯片会转到幻灯片中的第一个图像。

现在我遇到的关键问题是，使用下面的代码它可以工作，但点击后需要 5 秒才能显示第一张图片，我猜是因为超时功能。

请注意，这只是函数 slideShow 中包含的代码片段。

$("#slidecontrol2").click(function(){
    next.removeClass('is-showing');
    $('#container').children(':first').children(':first').addClass('is-showing');


  });

  setTimeout(slideShow, 5000);

我尝试在 click() 函数之后和 timeout 函数之前再次调用该函数。

 $("#slidecontrol2").click(function(){
        next.removeClass('is-showing');
        $('#container').children(':first').children(':first').addClass('is-showing');
        **slideShow ();**

      });

      setTimeout(slideShow, 5000);

它可以工作，但现在我的图像快疯了，我敢再点击一次，它加速并变得更疯狂。

请帮助任何人！

4

1 回答 1

0

我注意到它slideShow不带任何参数，因此它必须自己处理查找“可见”幻灯片和下一张幻灯片。在我看来，您还希望幻灯片自动发生（我从您的setTimeout(slideShow, 5000);行中收集）并且您希望在单击slidecontrol2元素时进入下一张幻灯片。由于slideShow处理了这种渐进式操作，因此您的代码应如下所示（下面的伪代码）：

var slideShow = function(){
    //Fades out current image, 
    //finds next image with class "is-showing" and fades it in
}

$(document).ready(function(){
    //Adds click handler to advance slideshow on click of button
    $("#slidecontrol2").click(function(){
        slideShow();
    });

    //Begins slideshow on load of page
    setTimeout(slideShow, 5000);
});
于 2012-11-15T21:36:41.460 回答