1首先，打開html編輯器，創(chuàng)建一個(gè)新的html文件，例如indexhtml，然后引入jquery，如下圖所示2其次，完成上述步驟后，在indexhtml的標(biāo)記中，輸入下圖紅框中的jquery代碼，如下圖所示3接著，完成上述步驟后，瀏覽。

舉個(gè)例子假設(shè)你已經(jīng)引入了jquery，而html結(jié)構(gòu)如下 那么你的js可以這么寫quot#swphotoquotclickfunction $quot#swphotoimgquottoggle。

if$index === 0 當(dāng)前為第一張輪播圖 quotbanquoteq$quotbanquotlength1addClassquotactivesiblingsquotbanquotremoveClassquotactivequot這里寫成你自動(dòng)切換的代碼，我這里只是一個(gè)無動(dòng)態(tài)切換效果的方法。

100 ， animationComplete functioncurrent 每個(gè)輪播圖切換后回調(diào)，這個(gè)應(yīng)該是隱藏圖片說明文字 $#39caption#39animate bottom0 ，200 if windowconsole consolelog。

將當(dāng)前顯示的BANNER圖片的索引值設(shè)置為0，也就是默認(rèn)是第一個(gè)圖片的序號(hào)var t = n = 0， count$documentreadyfunction定義獲取四張BANNER圖count=$quot#banner_list aquotlength 設(shè)置默認(rèn)顯示第一張。

1可以直接下載個(gè)Jquery 滾動(dòng)圖片插件2如果自己寫代碼，請(qǐng)參考以下lt！DOCTYPE html jquery 圖片自動(dòng)無縫滾動(dòng) ul，li liststyle margin 0。

count = 4 count = 0 setIntervalquotgoquot， 1000html代碼圖片一秒切換一次，arr配置需要切換的圖片，arr1配置對(duì)應(yīng)圖片的alt屬性，需要?jiǎng)e的屬性自己再增加數(shù)組。