1-3-1 圖片輪播

一、下載套件：

https://raw.githubusercontent.com/srobbin/jquery-backstretch/master/jquery.backstretch.min.js

將上列存至 class/backstretch/

二、引入套件：

<script src="class/backstretch/jquery.backstretch.min.js"></script>

三、設定
 

1. 若無圖片可至這裡下載合法使用的圖片：https://pixabay.com/

2. <script type="text/javascript">
     $(document).ready(function(){
       $('.top-content').backstretch([
          "img/3.jpg"
        , "img/2.jpg"
        , "img/1.jpg"
        ], {duration: 3000, fade: 750});
     });
   </script>

    

四、HTML

    <div class="top-content" style="height:560px;">
    </div>

五、修正與導航的內距

 style="margin-bottom:0px;"