不知道你的css是什么樣的，所以你的div和span我這里都看不到，我只幫你改了圖的輪播，var total = $quot#solid ulquotchildrenlengthvar now = 0var timer = nullquot#solid ul liquotcssquotdisplayquot，quot。

我們也可以將所有的輪播圖的圖片外面套一層div，并設(shè)置絕對(duì)定位，然后使用 父相子絕 ，來(lái)讓圖片可以相對(duì)父元素定位父元素就是裝輪播圖的盒子之后，只要我們讓不該顯示的圖片定位到盒子范圍外的位置父元素設(shè)置overflow。

你好這段代碼是輪播圖的自動(dòng)切換其中還設(shè)置了鼠標(biāo)移入移出的效果setInteval函數(shù)是個(gè)定時(shí)器，兩個(gè)參數(shù)一個(gè)是執(zhí)行的函數(shù)，一個(gè)是時(shí)間間隔就是根據(jù)給定的的時(shí)間間隔單位是毫秒執(zhí)行函數(shù)setIntervalautoChange，3000。

自動(dòng)切換到下一張 手指向左或者向右移動(dòng)的快時(shí)，會(huì)切換到下一張 圖片輪播是無(wú)限循環(huán)的， 我們需要采用 3 1 2 3 1的方式來(lái)實(shí)現(xiàn)， 即 N+2張圖來(lái)實(shí)現(xiàn)N張圖的無(wú)限循環(huán)輪播 我們通過(guò)分析現(xiàn)象，可以提出一個(gè)基本實(shí)現(xiàn)方案。

最簡(jiǎn)單的輪播廣告 body， div， ul， li margin 0padding 0 ul liststyletype body background #000textalign centerfont 12px20px Arial box position relativewidth。

你開(kāi)個(gè)定時(shí)器，一秒換一個(gè)img的src不就行了隨便寫了個(gè)new Vueelquot#appquot，datapicquotimages1jpgquot，quotimages2jpgquot，quotimages3jpgquot，quotimages4jpgquot，quotimages5jpgquot，iquot0quot，now。

具體代碼如下lt！doctype html Document *margin0 padding0 liststyle wrapheight170px width490px margin60px auto。

var width = 100圖片的寬度 ifleftlt=width left=arrlength1*width當(dāng)圖片完全走出顯示框，拼接到末尾 arristyleleft = left+quotpxquot moveId=setIntervalLeftMove，10設(shè)置一個(gè)10。

1首先，打開(kāi)html編輯器，新建html文件，例如indexhtml2在indexhtml中的script標(biāo)簽中，填入js代碼setInterval#39$quotimgquotattrquotsrcquot， quotsmall3pngquot#39，10003瀏覽器進(jìn)入indexhtml頁(yè)面中，此時(shí)顯示出一。