在 JavaScript 中,可以使用以下幾種方法來實現幻燈片輪播功能:
var slides = ['slide1.jpg', 'slide2.jpg', 'slide3.jpg'];
var currentIndex = 0;
function showSlide() {
// 更新幻燈片內容
document.getElementById('slide').src = slides[currentIndex];
// 更新當前顯示的幻燈片索引
currentIndex++;
// 如果已經顯示了所有幻燈片,則重新開始
if (currentIndex >= slides.length) {
currentIndex = 0;
}
}
setInterval(showSlide, 3000); // 每 3 秒切換一次幻燈片
var slides = document.getElementsByClassName('slide');
var currentIndex = 0;
function showSlide() {
// 隱藏當前顯示的幻燈片
slides[currentIndex].classList.remove('active');
// 更新當前顯示的幻燈片索引
currentIndex++;
// 如果已經顯示了所有幻燈片,則重新開始
if (currentIndex >= slides.length) {
currentIndex = 0;
}
// 顯示新的幻燈片
slides[currentIndex].classList.add('active');
}
setInterval(showSlide, 3000); // 每 3 秒切換一次幻燈片
以上是幾種常見的實現幻燈片輪播功能的方法,具體選擇哪種方法取決于項目需求和個人偏好。