javascript - 如何在 owl carousel 项之间添加空格

  显示原文与译文双语对照的内容
0 0

如何在owl项之间添加空格。 在项目之间添加 margin 或者 padding 。 这需要是 responsive.can 我向jquery添加一些 gutter 。

enter image description here


function newsCarousel(){
 $("#carousel").owlCarousel({
 items : 4,
 itemsCustom : false,
 itemsDesktop : [1199,4],
 itemsDesktopSmall : [980,2],
 itemsTablet: [768,1],
 itemsTabletSmall: false,
 itemsMobile : [479,1],
 singleItem : false,
 itemsScaleUp : false,
 mouseDrag : true,

//Basic Speeds
 slideSpeed : 200,
 paginationSpeed : 800,
 rewindSpeed : 1000,

//Autoplay
 autoPlay : true,
 stopOnHover : false,

//Auto height
 autoHeight : true,
 });
}

时间: 原作者:

0 0

基于这个演示,我会说,仅仅增加. item 类里custom.css


#owl-example. item{
. . .
 margin-left: 20px;
 margin-right: 20px;
}

为响应的站点和插件修改CSS时要小心。 如果需要针对不同的分辨率调整这里选项,你可以添加到你 custom.css 某些媒体查询并相应地扩展样式

原作者:
0 0

就像这样使用 margin:

function newsCarousel() { $("#carousel").owlCarousel({

项目:4,

margin: 20

autoHeight: true

%7D);

%7D

...