纯HTML+JS实现轮播
点击实现轮播图的原理:触发事件更换图片
自动轮播图的原理:加入定时器,自动触发事件更换图片
图片存储在一个数组内,更换图片就是更换数组索引从而达到效果
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>轮播原理图</title>
</head>
<body>
<div><!--添加两个按钮和默认出现的图-->
<button οnclick="prev()"> 上一个 </button>
<img id="slider" src="image/1.jpg" />
<button οnclick="next()"> 下一个 </button>
</div><!--JS代码-->
<script><!--定义一个数组放入轮播的图片-->
var images = [
"image/1.jpg",
"image/2.jpg",
"im