題目1： 輪播的實現原理是怎樣的？如果讓你來實現，你會抽象出哪些函數(or接口)供使用？（比如 play()）

• 橫向輪播（題目2）：

  • 布局：讓父容器相對定位，設定寬高為一個圖片的寬高，并且overflow:hidden（超出部分不顯示）；在父容器中設置一個圖片容器，高度為圖片高，寬度為圖片寬*圖片個數；在底部設置小圓點，絕對定位居于父容器底部；（橫向輪播圖組件react代碼， 橫向輪播圖scss代碼）
  • 邏輯：一開始將尾圖片和首圖片clone后，分別放在首尾；增加圖片容器的寬度；封裝向前/向后翻頁的方法（包含動畫，動畫鎖，變化小圓點狀態）；最后為按鈕添加事件（邏輯處理代碼）
  • 全局變量：curPage（當前第幾張圖片）和isAnimate（動畫加鎖）
  • 封裝函數：play(n):封裝向后n頁（n可以是負數），playNext:向后，playPre:向前。

• 淡入淡出、自動輪播圖（題目3）

  • 布局：類似與橫向輪播。但是圖片是絕對布局，可以互相覆蓋。一開始只有第一張圖片是顯示，其他隱藏。react組件，scss樣式

• 邏輯：與橫向輪播類似，不需要clone首尾圖片、重設寬度，但要設置定時器循環翻頁(邏輯處理代碼)

• 全局變量和封裝函數：與橫向輪播類似，方法play(n)

題目2： 實現視頻中的左右滾動無限循環輪播效果

• 代碼鏈接
• 效果鏈接

題目3： 實現一個漸變輪播效果, 效果范例25

• 代碼鏈接
• 效果鏈接