컴

jquery.bxSlide를 이용하여 슬라이드만들기

· 2014-10-25 (토) 04:25:02 · 5499 · 1

<script src="/jquery.bxslider/jquery.bxslider.min.js"></script>
<link href="/jquery.bxslider/jquery.bxslider.css" rel="stylesheet" />

<div style="width:600px">
   <ul class="slide">
      <li><img src="이미지명"></li>
      <li<img src="이미지명"></li>
      <li><img src="이미지명"></li>
  </ul>

 

<script type="text/javascript">
$(document).ready(function(){
 $('.slider').bxSlider({
   mode: 'fade',    //사라지는 모냥
   speen:3000     // 이미지변환 속도 기본 500
   pager: true,     //하단 페이지
   auto: true,     //자동시작
   captions: true,  //캡션
   controls:false //전 후 콘트롤 보이기 안보이기
 });
});
</script>


사이트 : http://bxslider.com/options

첨부파일

jquery.bxslider.zip (35.8 KB) 235회 2014-10-25 04:25
|

댓글 1개

자주쓰는 슬라이드인데 이렇게 정리해놓으니까 편하고 보기좋네요 감사합니다~
댓글을 작성하시려면 로그인이 필요합니다.

팁게시판

6,077건

디자인과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
제목 글쓴이 날짜 조회
14-12-17 조회 1,723
14-12-15 조회 4,122
14-12-08 조회 1,768
14-12-05 조회 2,335
14-12-02 조회 1,809
14-12-01 조회 1,864
14-11-27 조회 1,653
14-11-25 조회 1,347
14-11-25 조회 3,641
14-11-21 조회 1,519
14-11-20 조회 4,868
14-11-19 조회 1,347
14-11-12 조회 1,625
14-11-04 조회 4,748
14-10-30 조회 2,866
14-10-25 조회 2,247
14-10-25 조회 5,500
14-10-25 조회 2,397
14-10-25 조회 3,466
14-10-22 조회 4,380
14-10-22 조회 2,190
14-10-22 조회 2,138
14-10-22 조회 6,004
14-10-18 조회 2,926
14-10-17 조회 1,260