javascript图片滑块下一个上一个

时间:2017-04-06 07:04:57

标签: javascript

var slides = document.querySelectorAll('#slides .slide');	
	var current = 0;
    var Interval = setInterval(next,2000);

			function next() {
				slides[current].className = 'slide'; 
				current = (current+1)%slides.length;
				slides[current].className = 'slide showing';
			}
#slides {
    position: relative;
    height: 332px;
    width:100%;
    
}

.slide {
    position: absolute;
    
	
    max-height:332px;
	height:332px;
	overflow:hidden;
	width:100%;
    
   
    opacity: 0;
    z-index: 1;
    font-size: 40px;
color:#fff;

    
    -webkit-transition: opacity 1s;
    -moz-transition: opacity 1s;
    -o-transition: opacity 1s;
    transition: opacity 1s;

	}

.showing {
    opacity: 1;
    z-index: 2;
}
<ul id="slides">
    <li class="slide showing"><img src="1.jpg"></li>
    <li class="slide"><img src="2.jpg"></li>
    <li class="slide"><img src="3.jpg"></li>
    <li class="slide"><img src="4.jpg"></li>
    <li class="slide"><img src="5.jpg"></li>
    <li class="slide"><img src="6.jpeg"></li>

	</ul>

嗨,我是新来的javascript已经完成滑动我不知道如何为滑块添加下一个和上一个按钮。任何人在javascript中提供一个函数

我无法弄清问题是什么,也许有人可以帮助我。

0 个答案:

没有答案