推薦點選這個連結 Slick Slider →點選 get it now →點選 Download Now

在 head 區增加以下連結及載入：

<!--  jquery 函式庫  -->
<script src="js/jquery-3.3.1.min.js"></script>

<!--  slick plugin start  -->
<link rel="stylesheet" href="js/slick-1.8.1/slick/slick.css">
<link rel="stylesheet" href="js/slick-1.8.1/slick/slick-theme.css">
<script src="js/slick-1.8.1/slick/slick.min.js"></script>
<!--  slick plugin end  -->

在 #main 區域內增加以下HTML：

<!-- slick slider start -->
<div class="slider">
  <div><img src="images/index/slider_bg1.jpg" alt="" width="100%"></div>
  <div><img src="images/index/slider_bg2.jpg" alt="" width="100%"></div>
  <div><img src="images/index/slider_bg3.jpg" alt="" width="100%"></div>
</div>
<!-- slick slider end -->

增加 Script 程式，將準備好的HTML交給slick程式控制

<script>
  $('.slider').slick();
</script>

增加 Option 選項，設定自動播放

<script>
  $('.slider').slick({
      autoplay: true,
      autoplaySpeed: 4000
    });
</script>

參考 Slick Slider 的各種 Demos 及 Settings 設定各種需要的Option選項