Javascript 窗口大小调整时销毁循环2

当我检测到移动设备时，我正在使用并试图破坏窗口调整事件上的cycle2滑块。不幸的是，它返回以下两个错误：

[cycle2] slideshow must be initialized before sending commands; "destroy" ignored

[cycle2] slideshow must be initialized before sending commands; "reinit" ignored

也许有人能帮忙，我做错了什么？代码如下：

$(function() {


    var slider = $('.slider').cycle();

    condition = true;

        //destroy onload under condition
    if(condition){
        slider.cycle('destroy');        
    }   

        //destroy on resize 
    $(window).on('resize',function() {              

        condition = true; //Will be function to recondition let´s say it's true by now

        if(condition){

                slider.cycle('destroy');

        } else {            

                slider.cycle('reinit');             

        }

    });

});

---

谢谢。

看起来您正在破坏滑块：

if(condition){
    slider.cycle('destroy');        
}

你可以这样做：

$(function() {

    var $W = $(window),
        slider = $('.slider').cycle();

    $W.on('resize',function() {              

        if ($W.width() < 768) // width of device 
            slider.cycle('destroy');

    });

});

$（函数（）{
变量$W=$（窗口），
slider=$（'.slider'）.cycle（）；
$W.on（'resize'，function（）{
if（$W.width（）<768）//设备的宽度
滑块。循环（'destroy'）；
});
});

看起来您正在破坏滑块：

if(condition){
    slider.cycle('destroy');        
}

你可以这样做：

$(function() {

    var $W = $(window),
        slider = $('.slider').cycle();

    $W.on('resize',function() {              

        if ($W.width() < 768) // width of device 
            slider.cycle('destroy');

    });

});

$（函数（）{
变量$W=$（窗口），
slider=$（'.slider'）.cycle（）；
$W.on（'resize'，function（）{
if（$W.width（）<768）//设备的宽度
滑块。循环（'destroy'）；
});
});

我知道这是一个老问题，但我也在努力解决这个问题，在仔细阅读文档之后，我想到了这个问题

因此，我使用数据属性来设置幻灯片上的选项。我真的很喜欢这个功能

为了简单起见，这里是我的第一个cycle2div

<div data-cycle-carousel-visible="3" 
     data-cycle-carousel-fluid="true" 
     data-cycle-fx="carousel" 
     data-cycle-prev="#carousel-prev" 
     data-cycle-next="#carousel-next"
     class="cycle-slideshow cycle-front-page-slideshow"
>

这是您将幻灯片放映作为目标的地方（我的幻灯片放映使用.cycle front page slideshow类）

还请注意，如果要使用旋转木马功能，必须从下载cycle2旋转木马转换插件

---

希望这对其他人有所帮助。

我知道这是一个老问题，但我也在努力解决这个问题，在仔细阅读文档后，我得出了这个结论

因此，我使用数据属性来设置幻灯片上的选项。我真的很喜欢这个功能

为了简单起见，这里是我的第一个cycle2div

<div data-cycle-carousel-visible="3" 
     data-cycle-carousel-fluid="true" 
     data-cycle-fx="carousel" 
     data-cycle-prev="#carousel-prev" 
     data-cycle-next="#carousel-next"
     class="cycle-slideshow cycle-front-page-slideshow"
>

这是您将幻灯片放映作为目标的地方（我的幻灯片放映使用.cycle front page slideshow类）

还请注意，如果要使用旋转木马功能，必须从下载cycle2旋转木马转换插件

希望这能帮助其他人