Jquery jCarouselLite动态设置可见项目数

我试图在我的项目中使用jQuery jCarouselLite，但似乎没有一种方法可以根据屏幕大小动态更改“可见”选项。是否可以更改原始配置参数并立即在UI中查看更改？

以下是您的操作方法：

尝试调整小提琴中结果窗口的大小，以查看其效果

JS:

$（函数（）{
$（“.anyClass”）.jCarouselLite({
btnNext:“.next”，
btnPrev:“.prev”，
可见光：5
});
});
$（window.trigger（'resize'）；
$（窗口）。调整大小（函数（）{
如果（$（窗口）.width（）>300&$（窗口）.width（）<400）{
$（'.next，.prev'）。解除绑定（'click'）；
$（'.anyClass'）.jCarouselLite({
可见：3.5，
btnNext:“.next”，
btnPrev:“.prev”
});
}
如果（$（window.width（）>400&$（window.width（）<500）则为else{
$（'.next，.prev'）。解除绑定（'click'）；
$（'.anyClass'）.jCarouselLite({
可见：4.5，
btnNext:“.next”，
btnPrev:“.prev”
});
}
如果（$（窗口）.width（）>=500），则为else{
$（'.next，.prev'）。解除绑定（'click'）；
$（'.anyClass'）.jCarouselLite({
可见：5，
btnNext:“.next”，
btnPrev:“.prev”
});
}
});

HTML:

请展示一些代码，通过这些代码可以正确了解您的问题我的问题是，我不知道如何更改原始配置的值，然后再查看UI中的更改。我没有值得展示的代码，在查看源代码和谷歌搜索后，我尝试的一切都完全是一时兴起，但没有任何效果。请参阅本文中的插件js文件默认值，您可以设置所需的更改。您可以提供一些其他信息吗？我不知道你是什么意思对不起也许这不清楚。。。但我希望根据屏幕大小动态地进行调整。比如，有没有办法访问jQueryLite对象，设置新的可见项目数，然后刷新旋转木马？这太接近了。请注意，如果您将旋转木马向右移动几次，然后调整其大小，然后再次向右点击，它会像3张幻灯片一样通过，我想回到幻灯片1。酷..解决了您的问题。修复了它并更新了小提琴。基本上，我还必须更新按钮的点击处理程序。因此，我首先解除关联点击的绑定，然后使用jCarouselLite插件再次绑定它们

    $(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        visible: 5
    });
});

$(window).trigger('resize');

$(window).resize(function(){
    if($(window).width() > 300 && $(window).width() < 400){
        $('.next, .prev').unbind('click');
        $('.anyClass').jCarouselLite({
            visible: 3.5,
            btnNext: ".next",
            btnPrev: ".prev"
        });
    }
    else if($(window).width() > 400 && $(window).width() < 500){
        $('.next, .prev').unbind('click');
        $('.anyClass').jCarouselLite({
            visible: 4.5,
            btnNext: ".next",
            btnPrev: ".prev"
        });
    }
    else if($(window).width() >= 500){
        $('.next, .prev').unbind('click');
        $('.anyClass').jCarouselLite({
            visible: 5,
            btnNext: ".next",
            btnPrev: ".prev"
        });
    }
});

<button class="prev"><<</button>
<button class="next">>></button>

<div class="anyClass">
    <ul>
        <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
            <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
            <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
        <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
        <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
        <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
        <li><img src="http://placekitten.com/100/100" alt="" width="100" height="100" /></li>
    </ul>
</div>