Есть много способов карусели картины. Вот простой реализация JS Array.
Сначала храните путь изображения в массиве, а затем вызовите функцию 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> <стиль тип = "text/css"> #main {ширина: 700px; Высота: 450px; Поле: 0 Авто; Текст-альбом: Центр; } </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>Замечательное обмен темами: jquery picture carousel javascript picture carousel bootstrap picture carousel
Выше приведено в этой статье, я надеюсь, что это будет полезно для каждого обучения.