javascript - 调整屏幕大小时，我的多元素轮播正在折叠(Bootstrap)

Question

尝试调整输出屏幕，轮播会折叠，最后几个元素会下降，然后消失。我的需求是旋转木马在调整大小时不要折叠。

请帮帮我!

My CodePen

ResCarouselSize();

$(window).resize(function () {
  ResCarouselSize();
});

//this function define the size of the items
function ResCarouselSize() {
  var incno = 0;
  var dataItems = ("data-items");
  var itemClass = ('.item');
  var id = 0;
  var btnParentSb = '';
  var itemsSplit = '';
  var sampwidth = $(itemsMainDiv).width();
  var bodyWidth = $('body').width();
  $(itemsDiv).each(function () {
    id = id + 1;
    var itemNumbers = $(this).find(itemClass).length;
    btnParentSb = $(this).parent().attr(dataItems);
    itemsSplit = btnParentSb.split(',');
    $(this).parent().attr("id", "MultiCarousel" + id);

    if (bodyWidth >= 1200) {
      incno = itemsSplit[3];
      itemWidth = sampwidth / incno;
    }
    else if (bodyWidth >= 992) {
      incno = itemsSplit[2];
      itemWidth = sampwidth / incno;
    }
    else if (bodyWidth >= 768) {
      incno = itemsSplit[1];
      itemWidth = sampwidth / incno;
    }
    else {
      incno = itemsSplit[0];
      itemWidth = sampwidth / incno;
    }
    $(this).css({ 'transform': 'translateX(0px)', 'width': itemWidth * itemNumbers });
    $(this).find(itemClass).each(function () {
      $(this).outerWidth(itemWidth);
    });

    $(".leftLst").addClass("over");
    $(".rightLst").removeClass("over");

  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 1

.MultiCarousel{ Height: 185px;} 这会解决你的问题