小编Ire*_*ean的帖子

带按钮的自动幻灯片

我可以用javascript创建自动幻灯片.但我不仅希望手动,而且需要按钮控制.

我添加了一些手动控制代码.然后幻灯片显示无法正常工作.这是自动幻灯片放映的代码.如何修改它以使用按钮.

var slideIndex = 0;
showSlides();

function showSlides() {
    var i;
    var slides = document.getElementsByClassName("mySlides");
    var dots = document.getElementsByClassName("dot");
    for (i = 0; i < slides.length; i++) {
       slides[i].style.display = "none";  
    }
    slideIndex++;
    if (slideIndex> slides.length) {slideIndex = 1}    
    for (i = 0; i < dots.length; i++) {
        dots[i].className = dots[i].className.replace(" active", "");
    }
    slides[slideIndex-1].style.display = "block";  
    dots[slideIndex-1].className += " active";
    setTimeout(showSlides, 8000); // Change image every 8 seconds
}
Run Code Online (Sandbox Code Playgroud)
#slide{
	width:96%;
	}
	
* {
	box-sizing: border-box
}

.mySlides …
Run Code Online (Sandbox Code Playgroud)

html javascript css slideshow

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

html ×1

javascript ×1

slideshow ×1