html部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<link rel="stylesheet" href="css_02/css_02.css">
<script type="text/javascript" rel="script" src="js_02.js"></script>
<body>
<div class="main">
<a class="rightBy">
<
</a>
<img src="img02/04.jpg" id="slideshow" alt="">
<a class="leftBy">
>
</a>
</div>
</body>
</html>
js部分
var srcs = ["img02/04.jpg", "img02/13.webp", "img02/11.jpg", "img02/14.webp"]
var index = 0;
window.onload = function (){
var slideshows = document.getElementById("slideshow");
document.getElementsByClassName("rightBy")[0].onclick = function(){
//当方向切换图片的时候
index--;
if(index == -1){
index = srcs.length - 1;
}
slideshows.src = srcs[index];
}
document.getElementsByClassName("leftBy")[0].onclick = function(){
index++;
if (index == srcs.length){
index = 0;
}
slideshows.src = srcs[index]
}
setInterval(
function (){
index--;
if (index == -1) {
index = srcs.length - 1;
}
slideshows.src = srcs[index];
},1500
)
}