首先建立一個html檔案，下圖中我建立的是html5的，所以看起來很簡單。

然後在html的主體部分新增一個div標籤，然後在該標籤下新增一個img標籤，並設定img的寬高。

然後我們可以在html頭部標題下新增css樣式程式碼來控制div的顯示效果。

接下來在body標籤中新增js的事件onload，也就是載入該頁面的時候，呼叫onload的值對應的方法，圖中的話就是init()。

再為img新增一個id屬性，這樣我們可以透過getElementById("id值")來得到該元素標籤。

然後透過<script>標籤中，新增如下圖程式碼，完成輪播的功能。其中

setInterval(code,time);//兩個引數都是必須的，其中code是執行的方法或者程式碼串，time是時間間隔（以毫秒計，1000就是1秒，根據需要來調整）。

其中if語句中i的值跟圖片的數量和命名有關。

完成之後，透過瀏覽器去執行就可以看到效果，它會自動切換圖片，也就是輪播圖了。

(gif圖可能因為上傳網站的原因會有些不一樣。比如我在預覽的時候就會有圖片變大，但其實執行是時候，以及本地檢視gif圖的時候是圖片都一樣大的。）