테스트 사이트 - 개발 중인 베타 버전입니다

박스슬라이더 반응형 질문드립니다 채택완료

오똥이 6년 전 조회 5,520

현재 메인에 상품 슬라이드를 박스슬라이더로 이용하고있는데요 

홈페이지 화면이 1500아래일때 슬라이드 가로값을 300으로 변경하고싶습니다 ㅠㅠ

구글링 열시미해봐도 초보라 어렵네요 ㅠㅠ 코드는 이렇습니다! 감사합니다

</p>

<p>jQuery(function($){

    $('.sct_20').show().bxSlider({

        maxSlides: 3,

        moveSlides:1,

        slideWidth: 500,

        auto: true,

        pager:false

    });

});

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
유찬아빠
jQuery(function($){
var wid_val=0;
if($(document).width()<1500){
    wid_val = 300;
}else{
 wid_val = 500; // 1500 보다 클경우
}
    $('.sct_20').show().bxSlider({
        maxSlides: 3,
        moveSlides:1,
        slideWidth: wid_val,
        auto: true,
        pager:false
    });
});
로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

오똥이
6년 전
정말 감사합니다 ㅠㅠ!!!! 좋은 하루 되세요!!!!

댓글을 작성하려면 로그인이 필요합니다.

bonobono
6년 전

bxslider의 경우 width가 기본적으로 유동적으로 설정됍니다.

 

슬라이드를 감싸고있는 엘리먼트( ex:div )의 가로값을 미디어쿼리를 사용해 width 300으로 변경하세요

 

예)

@media screen and (max-width:1500px){

div { width:300px }

}

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

오똥이
6년 전
감사합니다~!

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인