javascript - 無縫輪播最后一張?jiān)趺辞袚Q到第一張?
問題描述
<script> var next = document.getElementById('next'); var prev = document.getElementById('prev'); var ul = document.getElementsByTagName('ul')[0]; var li = document.getElementsByTagName('li'); var x=0; next.onclick = function(){x = x -289;ul.style.transform='translate3d('+x+'px,0,0)';} prev.onclick = function(){x = x +289;ul.style.transform='translate3d('+x+'px,0,0)'; }</script>
問題解答
回答1:可以把第一張復(fù)制,放到最后。例如: 123451當(dāng)輪播到了最后一張1的時(shí)候,把整個(gè)的輪播圖移動(dòng)位置還原為原始狀態(tài)。
回答2:把輪播圖clone出一個(gè)一樣的。(eg:(圖1圖2圖3)(圖1圖2圖3))
當(dāng)圖片移動(dòng)到序號(hào)為1的時(shí)候判斷有沒有上一個(gè)元素,如果沒有把后面整個(gè)sroll搬過去到最前面去,然后做輪播,否則直接輪播(這種情況注意定位的left值也要隨之先改變)
當(dāng)移動(dòng)到最后一張的時(shí)候同理
相關(guān)文章:
1. python - 管道符和ssh傳文件2. javascript - 數(shù)組原聲方法中的一段代碼3. html - eclipse 標(biāo)簽錯(cuò)誤4. 求大神幫我看看是哪里寫錯(cuò)了 感謝細(xì)心解答5. php自學(xué)從哪里開始?6. javascript - 怎么實(shí)現(xiàn)移動(dòng)端頁面滑動(dòng)切換,從1可以滑到2 但是不能從2滑回1 這樣的效果呢?7. javascript - JS設(shè)置Video視頻對(duì)象的currentTime時(shí)出現(xiàn)了問題,IE,Edge,火狐,都可以設(shè)置,反而chrom卻...8. 數(shù)據(jù)庫 - MySQL 單表500W+數(shù)據(jù),查詢超時(shí),如何優(yōu)化呢?9. javascript - 如果所有請(qǐng)求都放到actions 里面,那拿到的數(shù)據(jù)應(yīng)該 放在哪里,state 還是vue實(shí)例里面的data?10. phpstady在win10上運(yùn)行
