輪播圖

下載套件請儲存在網頁目錄，並解壓縮，其結構為

css：在引入

  <!-- 引入輪播圖 CSS -->
  <link rel="stylesheet" href="demo/css/flexslider.css" type="text/css" media="screen" />

js：在jquery.js 後面引入

  <!-- 引入輪播圖js,注意須放在 jquery.min.js 後面-->
  <script defer src="demo/js/jquery.flexslider.js"></script>

  <script type="text/javascript">
    $(window).load(function(){
      $('.flexslider').flexslider({
        animation: "slide",
        controlNav: false, //關閉導航
        itemMargin: 0,
        start: function(slider){
          $('body').removeClass('loading');
        }
      });
    });
  </script>

html

  <!-- 輪播圖 -->
  <section class="slider"   style="margin-top:52px;" >
    <div class="flexslider"  style="border:none;">
      <ul class="slides">
        <li>
          <img src="demo/images/2015_1.jpg"/>
        </li>
        <li>
          <img src="demo/images/2015_2.jpg" />
        </li>
        <li>
          <img src="demo/images/2015_3.jpg" />
        </li>
      </ul>
    </div>
  </section>
  <!-- 輪播圖 end-->