slick 슬라이더 이전 다음 슬라이드 안 보이게
관련링크
본문
모니터 화면 비율 100%일 때는 당연히 이전 다음 슬라이드가 안 보이는데
화면 비율을 100% 이하로 낮추면 양 옆에 이전 다음 슬라이드가 보입니다.
이걸 안 보이게 하고 싶은데 어떻게 하면 될까요?
배너 이미지 witdh 값 늘리는 방법 말고는 없을까요?
<script type="text/javascript">
$(function(){
$('.main_v .slider-for')
.on('init', function(){}).slick({
/*
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
fade: false,
asNavFor: '.slider-nav',
autoplay: true,
autoplaySpeed :3000,
speed:300,
variableWidth: true,
adaptiveHeight: true,
draggable : false,
dots: false,
infinite:true*/
autoplay: true,
dots: false,
arrows: false,
infinite: true,
autoplaySpeed :4000,
speed:300,
slidesToShow: 1,
centerMode:true,
variableWidth: true,
adaptiveHeight: true,
draggable : false,
asNavFor: '.slider-nav'
});
$('.main_v .slider-nav')
.on('init', function(){}).slick({
slidesToShow: 7,
slidesToScroll: 1,
asNavFor: '.slider-for',
dots: false,
arrows: false,
//centerMode: true,
focusOnSelect: true
});
$('.main_v .auto-control-box a.play-btn').click(function() {
$(this).toggleClass('stop');
if($(this).hasClass('stop')) {
$('.main_v .slider').slick('slickPause');
} else {
$('.main_v .slider').slick('slickPlay');
}
});
$('.main_v .main_v_left_btn').on('click', function() {
$('.main_v .slider').slick('slickPrev');
});
$('.main_v .main_v_right_btn').on('click', function() {
$('.main_v .slider').slick('slickNext');
});
});
</script>
</div>
