0

我有 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 代码是 left:0，看来我不能在 jcarousel 周围添加箭头。

4

1 回答 1

0

似乎您尝试做的事情可以通过使用非精简版jCarousel来解决。我认为使用精简版并不容易。

它们提供了一个响应示例。

于 2014-02-26T15:13:40.620 回答