console
$(function(){
//affect:1
$(".af1").slide({
affect:1,
time:3000,
speed:400,
dot_text:false,
});
//affect:2
$(".af2").slide({
affect:2,
time:3000,
speed:400,
});
//affect:3
$(".af3").slide({
affect:3,
time:3000,
speed:400,
});
//affect:4
$(".af4").slide({
affect:4,
time:3000,
speed:400,
});
})
<div class="wrap af1">
<ul class="slidebox">
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
</ul>
</div>
<div class="wrap af2">
<ul class="slidebox">
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
</ul>
</div>
<div class="wrap af3">
<ul class="slidebox">
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
</ul>
</div>
<div class="wrap af4">
<ul class="slidebox">
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840100&di=7dc4271ec4f1c909280d7e7852aa8eb5&imgtype=0&src=http%3A%2F%2Fwenwen.soso.com%2Fp%2F20120204%2F20120204203905-506483401.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840094&di=33183b5ba3200df614e3f3027aab0486&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3Da563e5daab4bd1130498bf366f9f8839%2F9358d109b3de9c82bcaef8266a81800a18d8434b.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840091&di=aba6577bb3dfff24807982acaf1ea076&imgtype=0&src=http%3A%2F%2Fd.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3D28cd5981b0119313c716f7b4500820e1%2Fb999a9014c086e06661ba80800087bf40bd1cbc6.jpg" /></a></li>
<li><a href="#"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1493113840089&di=6f520717a1335aa358b936ef96033964&imgtype=0&src=http%3A%2F%2Fg.hiphotos.baidu.com%2Fzhidao%2Fwh%253D450%252C600%2Fsign%3D8d1b9ffd054f78f0805e92f74c012663%2Fbd3eb13533fa828bd0e89c4afb1f4134960a5a4b.jpg" /></a></li>
</ul>
</div>
* {margin:0;padding:0;}
ul {list-style:none;}
.wrap {width:670px;height:240px;position:relative;overflow:hidden;float:left;margin:20px;}
.slidebox {width:670px;position:absolute;top:0;left:0;height:240px;}
.slidebox li {float:left;width:670px;height:240px;left:0;top:0;}
.slidebox li img {display:block;width:670px;height:240px;}
.dot {position:absolute;width:100%;height:30px;background:rgba(0,0,0,0.3);text-align:right;bottom:0;left:0;}
.dot p {margin-right:10px;}
.dot b {width:17px;height:17px;border-radius:20px;color:#333;display:inline-block;border:1px solid #fff;background:#fff;text-align:center;line-height:17px;margin:0 3px;margin-top:6px;cursor:pointer;font-weight:normal;}
.dot .cur {background:#F63;color:#fff;border:1px solid #f63;}