0
플러그인 owlcarousel2로 슬라이더를 만들고 루프를 false로 설정하여 루핑을 멈추고 내가 원하는 마지막 요소를 비워 둡니다.빈칸 제거 owlcarousel 2 with loop false with first item
하지만 어쨌든 첫 번째 항목 또는 첫 번째 항목의 빈 칸을 제거하고 싶습니다. 더 나은
$(document).ready(function(){
$('.slider-wrap').owlCarousel({
center: true,
items: 3,
loop: false,
margin: 10,
nav: true,
dots: false,
touchDrag : false,
mouseDrag : false
});
$('.slider-wrap .owl-stage').css('transform','translateX(0)');
$('.slider-wrap').on('changed.owl.carousel', function(e) {
var slidIndex = (e.item.index + 1) - e.relatedTarget._clones.length/2;
if(slidIndex == 1){
$('.slider-wrap .owl-stage').css('background-color','yellow');
$('.slider-wrap .owl-stage').css('transform','translateX(0)');
}
});
});.item{
height: 100px;
background-color: red;
}<link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.theme.default.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.carousel.min.css" rel="stylesheet"/>
<div class="container">
\t \t <div class="row">
\t \t \t <div class="slider-container">
\t \t \t \t <div class="slider-wrap owl-carousel">
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 1
\t \t \t \t \t </div>
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 2
\t \t \t \t \t </div>
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 3
\t \t \t \t \t </div>
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 4
\t \t \t \t \t </div>
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 5
\t \t \t \t \t </div>
\t \t \t \t \t <div class="item">
\t \t \t \t \t \t 6
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js"></script>
나는 의도적으로 false로 루프를 설정합니다. 하지만 빈 공간에 첫 번째 항목을 피할 수있는 방법 – rnDesto