我目前正在尝试创建一个具有不同数量的项目和宽度/边距的响应式旋转木马，我正在使用Owl Carousel

Owl Carousel提供了一个很棒的选项，允许您以这种方式指定在特定屏幕尺寸下显示的项目数：

carousel.owlCarousel({
    items : 4,
    itemsDesktop : [1100,3],
    itemsDesktopSmall : [700,2],
    itemsTablet: [600,2],
    itemsMobile : [400, 1]
});

因此，在窗口宽度为700到1100之间，旋转木马将显示3个项目 .

这是我的轮播项目所采用的基本结构 .

<div class="owl-item">
    <div class="item">
        ITEM CONTENT
    </div>
</div>

由于某些造型要求，在.item上需要有一定比例的右手边距

我想使用媒体查询添加它，但是当JS测量窗口的宽度并且CSS媒体查询测量视口的宽度时，当存在滚动条时，我的JS中指定的值将不与CSS媒体查询宽度相关联 .

谁能想到解决这个问题？ （最好没有任何沉重的jquery）

javascript jquery css media-queries carousel