我的多项目轮播在调整屏幕大小时崩溃了（引导程序）

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 {高度：185px;} ，这将解决您的问题