html:
<div id="dlunbo"> <div class="ig"><img src="img/100.jpg" /></div> <div class="ig"><img src="img/101.jpg" /></div> <div class="ig"><img src="img/103.jpg" /></div> <div class="ig"><img src="img/104.jpg" /></div> <div class="ig"><img src="img/105.jpg" /></div> <div class="ig"><img src="img/106.jpg" /></div> </div>
css:
.ig img { width: 350px; border-radius: 30px; } .ig { position: absolute; } #dlunbo { width: 350px; height: 233px; position: absolute; top: 150px; left: 100px; }
js:
var i = 0; function startLunbo() { $(".ig").eq(0).show().siblings().hide();//第一张图片显示,其余的图片隐藏 setInterval(function () { i++; if (i == 6) { i = 0; } $(".ig").eq(i).fadeIn(300).siblings().fadeOut(300); }, 4000); } $(function () { startLunbo(); })