* { 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属性来实现轮播的效果