slick 슬라이더 이전 다음 슬라이드 안 보이게

slick 슬라이더 이전 다음 슬라이드 안 보이게

QA

slick 슬라이더 이전 다음 슬라이드 안 보이게

본문

모니터 화면 비율 100%일 때는 당연히 이전 다음 슬라이드가 안 보이는데

화면 비율을 100% 이하로 낮추면 양 옆에 이전 다음 슬라이드가 보입니다. 

 

이걸 안 보이게 하고 싶은데 어떻게 하면 될까요?

배너 이미지 witdh 값 늘리는 방법 말고는 없을까요?

 

1025824790_1643337120.1493.png

 

        <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>

이 질문에 댓글 쓰기 :

답변 1

 centerMode:true, 부분 아래 처럼 주석 처리해보세요.

답변을 작성하시기 전에 로그인 해주세요.
전체 44
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT