html - jcarousel和响应式布局

我有jcarousel，我设法让他展示8个元素。现在，我想调整浏览器的大小，甚至调整jcarousel的大小，因为否则jcarousel条会从浏览器空间中消失。
我尝试做：

  $( window ).resize(function() {
        $("#Carousel").jcarouselLite({
                visible: 5
        });
  });

在头上。但这似乎不起作用。
如果浏览器太小（例如在手机上查看过），最好让jcarousel消失并查看项目列表？
@media？
因为即使图库中的图像也是100px，总是100px。如有必要，我可以提供一个示例。

现在也尝试过这样的事情：
      $（window）.trigger（'resize'）;

 $(window).resize(function(){
if($(window).width() > 300 && $(window).width() < 500){
    $('.next, .prev').unbind('click');
    $('.image-gallery').jCarouselLite({
        visible: 3.5,
        btnNext: ".next",
        btnPrev: ".prev"
    });
}
else if($(window).width() > 500 && $(window).width() < 700){
    $('.next, .prev').unbind('click');
    $('.image-gallery').jCarouselLite({
        visible: 4.5,
        btnNext: ".next",
        btnPrev: ".prev"
    });
}
else if($(window).width() > 700 && $(window).width() < 900){
    $('.next, .prev').unbind('click');
    $('.image-gallery').jCarouselLite({
        visible: 5,
        btnNext: ".next",
        btnPrev: ".prev"
    });
}
    else if($(window).width() > 1000){
    $('.next, .prev').unbind('click');
    $('.image-gallery').jCarouselLite({
        visible: 6,
        btnNext: ".next",
        btnPrev: ".prev"
    });
}
 });

它有效，但是我有一个问题，因为它向我显示了我骑车时可以看到的元素。
并非每个元素
另一个奇怪的事情是，由于JcarouselLite代码还剩0 ：，看来我无法在jcarousel周围添加Arrow。

最佳答案

看起来您要尝试执行的操作可以通过使用非精简版jCarousel来解决。我认为使用精简版并不容易。

它们提供一个responsive example。