本文实例为大家分享了js实现简单轮播图的具体代码,供大家参考,具体内容如下
一、写入网页基本结构
body:
网页的最外部设置一个id为wrap的容器,取代body,这样方便我们做一些初始化
css:
初始化:
包括外边距margin、内边距padding、链接a、图片img、输入框input、列表ul、li、网页html、body一系列初始化
css设置:
根据图片数与图片宽度设置轮播图宽度
二、设置js逻辑
需要完成的功能有:
1、鼠标移入轮播图逐渐出现左右浮动块
2、点击浮动块切换图片
3、点击小圆点切换图片
4、切换图片同时切换小圆点
5、自动播放
6、鼠标移入轮播图自动播放停止、移出
1