jQuery循环2通过调整窗口大小更改幻灯片放映元素的数量

我正在为桌面和平板电脑视图构建一个响应性设计。在这个设计中，我使用了一个或多个幻灯片构建。此幻灯片在桌面中包含3个滑块中的对象，在平板电脑版本中仅包含2个

我的方法：我正在检查窗口大小调整事件，打开所有循环标题，将新标题环绕给定数量的元素并重新插入循环插件

我的问题：在我尝试重新启动cycle插件之前，一切正常。如果没有任何失败或其他什么的话，它就是不起作用。所以问题似乎就出在缰绳上

我的代码：

//function to fire the resize event when its done
var delay = (function(){
    var timer = 0;
    return function(callback, ms){
    clearTimeout (timer);
    timer = setTimeout(callback, ms);
    };
})();

$(window).resize(function() {
    delay(function(){
        if( window.innerWidth <= 979 ){
            resizeWrapper( 2 );
        }
    }, 500);
});

//function for delete wrappers and wrap new ones based on a given number
function resizeWrapper( numberOfItems ){
    $( '.productsItem' ).unwrap();

    var $set_latestProductsCycle = $( '#latestProductsCycle' ).children();
    for( var i=0, len = $set_latestProductsCycle.length; i < len; i+=numberOfItems ){
        $set_latestProductsCycle.slice( i, i+numberOfItems ).wrapAll( '<div class="popularProductsWrapper"/>' );
    }
    $( '#latestProductsCycle' ).cycle({
        fx: 'scrollHorz',
        prev: '#latestProductsButtonLeft',
        next: '#latestProductsButtonRight',
        timeout: 0,
        caption: '.popularProductsWrapper'
    });
}

//完成调整大小事件时激发该事件的函数
变量延迟=（函数（）{
var定时器=0；
返回函数（回调，毫秒）{
清除超时（计时器）；
定时器=设置超时（回调，毫秒）；
};
})();
$（窗口）。调整大小（函数（）{
延迟（函数（）{
如果（window.innerWidth自己回答问题：

我忘了删除sentinel容器，它将在您第一次调用cycle脚本时创建。此外，当我重新调用cycle容器时，不需要定义“标题”

简而言之，函数应如下所示：

    function resizeWrapper( cycleContainer, numberOfItems ){
    $( cycleContainer ).cycle( 'destroy' );
    $( cycleContainer + ' .cycle-sentinel' ).remove();

    $( cycleContainer + ' .slider .item' ).unwrap();

    var $set_latestProductsCycle = $( cycleContainer ).children();

    for( var i=0, len = $set_latestProductsCycle.length; i < len; i+=numberOfItems ){
        $set_latestProductsCycle.slice( i, i+numberOfItems ).wrapAll( '<div class="slider"/>' );
    }

    $( cycleContainer ).cycle({
        fx: 'scrollHorz',
        prev: cycleContainer + 'Prev',
        next: cycleContainer + 'Next',
        timeout: 0
    });
}

函数大小包装器（cycleContainer，numberOfItems）{
$（cycleContainer）.cycle（'destroy'）；
$（cycleContainer+'.cycle sentinel'）.remove（）；
$（cycleContainer+'.slider.item'）.unwrap（）；
var$set_latestProductsCycle=$（cycleContainer）.children（）；
对于（变量i=0，len=$set\u latestProductsCycle.length；i

谢谢大家的关注。
请自己回答这个问题：

我忘了删除sentinel容器，它将在您第一次调用cycle脚本时创建。此外，当我重新调用cycle容器时，不需要定义“标题”

简而言之，函数应如下所示：

    function resizeWrapper( cycleContainer, numberOfItems ){
    $( cycleContainer ).cycle( 'destroy' );
    $( cycleContainer + ' .cycle-sentinel' ).remove();

    $( cycleContainer + ' .slider .item' ).unwrap();

    var $set_latestProductsCycle = $( cycleContainer ).children();

    for( var i=0, len = $set_latestProductsCycle.length; i < len; i+=numberOfItems ){
        $set_latestProductsCycle.slice( i, i+numberOfItems ).wrapAll( '<div class="slider"/>' );
    }

    $( cycleContainer ).cycle({
        fx: 'scrollHorz',
        prev: cycleContainer + 'Prev',
        next: cycleContainer + 'Next',
        timeout: 0
    });
}

函数大小包装器（cycleContainer，numberOfItems）{
$（cycleContainer）.cycle（'destroy'）；
$（cycleContainer+'.cycle sentinel'）.remove（）；
$（cycleContainer+'.slider.item'）.unwrap（）；
var$set_latestProductsCycle=$（cycleContainer）.children（）；
对于（变量i=0，len=$set\u latestProductsCycle.length；i

谢谢大家的关注