* {
padding:0%;
margin:0%;
}
.image {
width:450px;
height:250px;
display:none;
}
.wrap {
margin-top:200px;
width:450px;
height:250px;
margin-left:auto;
margin-right:auto;
border:1px solid black;
position:relative;
}
.btn1 {
position:absolute;
left:0px;
top:100px;
width:20px;
height:30px;
cursor:pointer;
}
.btn2 {
position:absolute;
right:0px;
top:100px;
width:20px;
height:30px;
cursor:pointer;
}
.dot {
width:10px;
height:10px;
border-radius:10px;
border:1px solid white;
background:none;
position:absolute;
cursor:pointer;
}
.dot1 {
top:231px;
left:300px;
}
.dot2 {
top:231px;
left:320px;
}
.dot3 {
top:231px;
left:340px;
}
.dot4 {
top:231px;
left:360px;
}
.dot-white {
background:white;
}
更新时间:2020-11-02 10:51:17
此为基础的javascriptt代码实现轮播图,这里提供了一个轮播图模板,其图片初始时是重叠在一起的,通过display属性来实现轮播的效果