bxSlider可以实现 Slider 和滚动效果。这个插件使用非常简单,并且大小只有 8kb,非常轻量级,所以非常适合在站点和博客中使用。
HTML
<div class="box-slider" id="sucaihuo">
<a href="#" class="box-slider-seta-up"></a>
<div class="box-slider-content">
<div class="box-slider-move">
<div class="item"><span></span></div>
<div class="item"><span></span></div>
......
<div class="item last-item"><span></span></div>
</div>
</div>
<a href="#" class="box-slider-seta-down"></a>
</div>
引入jquery库和boxSlider插件
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/jquery-boxSlider.js"></script>
演示一:垂直/竖向
$(function() {
$('#sucaihuo').boxSlider({
orientation: 'vertical',
});
});
演示一:水平/横向
$(function() { $("#sucaihuo").boxSlider({ orientation: 'horizontal', speed: 3 }); });
演示三:回调函数
$(function() {
$("#sucaihuo").boxSlider({
orientation: 'horizontal',
speed: 3,
added: function() {
alert('初始化完成')
}
});
});
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791