大家好,我是前端小白,前段时间也是在做一个项目,自己也根据搜索,学习了网站中较为常见的轮播图,下面我就分享一下。
这是轮播图的html结构,ul里的li标签放置三张轮播图片,ol控制圆点效果以及加载脚本。
.example2 ol{
position:relative;
width: 200px;
height: 40px;
top:-30px;
left:460px;}
.example2 ol li{
float:left;
width: 18px;
height: 18px;
margin: 5px;
background: #fff;
border-radius: 50%;
}
.example2 ol li.seleted{
background: #fca500;
}
以上是圆点样式
以下是内置的JS样式
.luara-left{
position:relative;
padding:0;
overflow: hidden;
}
.luara-left ul{
position: relative;
padding: inherit;
margin: 0;
}
.luara-left ul li{
float: left;
padding: inherit;
margin: inherit;
list-style: none;
}
.luara-left ul li img{
width: inherit;
height: inherit;
}
$(".example2").luara({width:"990",height:"400",interval:4500,selected:"seleted",deriction:"left"});
以上脚本部分。
不过,在使用之前是需要引入两个JQUERY库,一个是JQUERY,一个是自己的LUARA插件,两者缺一不可。

下面我放的是插件地址:https://pan.baidu.com/s/1zmeJsuymng-VmhGwdx9l2w 密码:2sra。
jquery库相信大家都有了。
毕竟也是刚入门的下白,大神不喜勿喷。拜谢