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

bxslider 질문입니다. 채택완료

강양이 7년 전 조회 3,398

메인이미지 슬라이드에 썸네일이 필요해서 bxslider에 pagerCustom을 사용하고 있습니다.

 

$(document).ready(function(){
 $(".bxslide").bxSlider({
   auto: true,
   speed: 500,
   pause: 4000,
   minSlides:1,
   maxSlides:1,
   mode:'fade',
   pager:true,
   pagerCustom:'#thumnail' <-썸네일페이징입니다.
  });
});

 

썸네일은 나오는데 혹시 이미지 슬라이드가 되었을 때 해당 이미지의 썸네일에 border라던가, css등을 추가할 수 있을까요?

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

답변 1개

채택된 답변
+20 포인트
틸란
7년 전

예시)

페이징예시를 아래처럼 구성할경우

<div id="thumnail" >
        <ul>                                
            <li><a data-slide-index="0" href="#"><img ></a></li>
            <li><a data-slide-index="1" href="#"><img ></a></li>
            <li><a data-slide-index="2" href="#"><img ></a></li>
        </ul>
    </div>

 

스크립트실행시 슬라이드 되는  a태그에 class="active" 가 추가되는 것 같던데..

#thumnail li a.active{  }

이런식으로 css 추가하면 되지 않을까 싶으니 테스트 해보시기 바랍니다.

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

답변에 대한 댓글 1개

강양이
7년 전
감사합니다 :)

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

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

로그인