图片轮播效果:
具体功能:图片自动循环轮播,鼠标放到图片上停止轮播,鼠标移开继续轮播
代码案例
已经上传到博客资源里,可以下载测试。
或者复制代码,再当前目录下新建mages目录放几张对应文件名的图片也可以。
rel="stylesheet" type="text/css" href="" />
- 1
- 2
- 3
- 4
- 5
- 6
总结:
1.上面案例关键点使用一个全局变量来控制自动轮播,那么代码 和函数之间关联性大,所以逻辑理解起来比较复杂。
2.还有一个方法:之前写出来,找不到放在哪里了。所以只说思路,以后再补回来,有兴趣可以试试,写出来记得留言。
每次轮播在定时器里读出当前显示的图片,然后再轮播到下一张图片。这种方法符合人的逻辑,