為什麼要自己實現
圖片輪播，這其實已經是一個爛大街的功能，到處可見；網上也有很多現成的元件，那為什麼還要自己來實現呢？主要的原因有兩個
- 效能
- 定製化
一個是網上的元件良莠不齊，在pc跑跑還可以，到了移動端，各種卡。
另外一個原因，是因為有諸多定製化的互動要實現，所以還是自力更生，豐衣足食！
舉兩個栗子
在自己擼程式碼之前，先來看看別人家的元件，正所謂：不看白不看。下面列舉兩種網上比較通用的輪播方案
- 方案一
- 方案二
方案一在輪播至邊界時，需要從這一端快速滑動至另外一端，體驗不佳；
方案二對邊界輪播做了優化，但還是略顯不足；
原創方案
接下來看看相關的示意圖！
- 容器用了虛線框，因為此方案的ul是不需要設定寬高的
- 容器ul和元素li都使用了translate3d以及相關屬性,從而更好的利用硬體加速
- 邊界處理：只移動一個元素，便可實現迴圈，價效比更高
原創demo
只處理了移動端事件（touch系列），所以要體驗完整功能，請使用移動端瀏覽器開啟以下例項。
github專案
更多細節和原始碼，請：點選訪問