1

我正在使用 JQuery Simple Carousel,它做的一切都很好(自动播放,在每个列表项之间淡入淡出,上一个和下一个按钮)......但问题是当我点击一个按钮时它会停止自动播放。我想找到一个解决方案,一旦单击,轮播再次启动的时间是通常自动播放一次所需的时间的两倍。这是代码

<script type="text/javascript">
    jQuery(document).ready(function() {
        // Carousel 
        $("ul.writein").simplecarousel({
            width:692,
            height:148,
            auto: 5000,
            fade: 700,
            next: $('.next'),
            prev: $('.prev')
        });
    });

</script>
4

1 回答 1

1

问题出在以下代码部分:

if(typeof click != "undefined")
config.auto = false;

在您使用任何导航后,它会有效地停止轮播。要解决这个问题,您需要:

编辑添加动画超时重置

添加将存储超时以及超时是否处于活动状态的变量:

var myTimer, timerActive = false;

紧接着var li = ul.children('li');

代替:

if(typeof click != "undefined")
            config.auto = false;

        if(config.auto!=false)
            setTimeout(function() {
                slide('next');
            }, config.auto);

和:

if(typeof click != "undefined"){
    if(config.auto!=false){
        if (timerActive) clearTimeout(myTimer);
        myTimer = setTimeout(function() {
                slide('next');
            }, config.auto * 2);
        }
        timerActive = true;
    }
    else{
        if(config.auto!=false){
            if (timerActive) clearTimeout(myTimer);
            myTimer = setTimeout(function() {
                slide('next');
            }, config.auto);
            timerActive = true;
        }
    }

并在轮播代码的最后替换:

if(config.auto!=false)
        setTimeout(function() {
            slide('next');
        }, config.auto);

和:

if(config.auto!=false){
            if (timerActive) clearTimeout(myTimer);
            myTimer = setTimeout(function() {
                slide('next');
            }, config.auto);
            timerActive = true;
        }

----结束编辑----

请注意,我实际上没有测试过任何这些 - 可能有错别字等。如果它不起作用,你可以随时尝试为 jQuery 旋转木马我写了https://github.com/c2h5oh/jQuery-Cycle-Uber-精简版

于 2012-06-06T21:27:00.473 回答