写真をカルーセルする方法はたくさんあります。簡単なものは次のとおりです。JSアレイの実装です。
最初に画像パスを配列に保存し、setinterval関数を呼び出して画像を順番にカルーセルします
<script type = "text/javascript"> var curindex = 0; var timeinterval = 1000; var arr = new array（）; arr [0] = "1.png"; arr [1] = "2.png"; arr [2] = "3.png"; arr [3] = "4.png"; arr [4] = "5.png"; setInterval（changeimg、timeinterval）; function changeimg（）{var obj = document.getElementById（ "imge"）; if（curindex == arr.length-1）{curindex = 0; } else {curindex += 1; } obj.src = arr [curindex]; } </script>以下の完全な例
<！doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title>自動画像carousel </title> <style type = "text/css"> #main {width：700px;高さ：450px;マージン：0 Auto;テキストアライグ：センター; } </style> <script type = "text/javascript"> var curindex = 0; var timeinterval = 1000; var arr = new array（）; arr [0] = "1.png"; arr [1] = "2.png"; arr [2] = "3.png"; arr [3] = "4.png"; arr [4] = "5.png"; setInterval（changeimg、timeinterval）; function changeimg（）{var obj = document.getElementById（ "imge"）; if（curindex == arr.length-1）{curindex = 0; } else {curindex += 1; } obj.src = arr [curindex]; } </script> </head> <body> <div id = "main"> <h1>自動画像カルーセルを実現するために配列を使用</h1> <img id = "imge" src = "1.png"/> </div> </body> </html> </html>素晴らしいトピックの共有：jQueryの写真カルーセルjavascript写真カルーセルブートストラップ写真カルーセル
上記はこの記事に関するものです。すべての人の学習に役立つことを願っています。