制作自动轮播图及解析

dome地址：laihuamin.github.io/jsExample/html/fourth2.html

HTML部分：

放置五张图片和五个按钮。

HTML

css部分：

1、外部的包裹框wrap：设置位于视口中央

wrap

2、内容块和图片总体设置

content和img

3、按钮群和每个按钮设置。

button

4、高亮样式设置

current

JS代码部分

1、获取dom元素及定义变量、对象

获取dom元素及定义变量、对象

2、设置展示函数showImg函数；   注意点：

1）index = a 是因为index为全局变量，当按钮切换时，可以记入按钮位置。

2）两个循环遍历是为了整体清空之后再添加新的

3）使用clearInterval是为了让淡入淡出效果，每次都从零开始。

4）使用定时器增加改变透明度和滤镜来增加淡入淡出效果。

showImg函数

3、设置按钮切换

按钮切换

4、设置鼠标划过内容块的停留和鼠标移出的继续效果。