多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
[TOC] #bxslider插件应用 ## 准备 去官网下载包,还有Jquery库(不要特别高的版本)官网地址http://bxslider.com 然后去找Download<br> **我们为什么要用slider呢?(个人觉得比国产Swiper好~)↓** ![](https://box.kancloud.cn/2f186d895569a87de2d10abbba07bd32_606x330.png) ## 使用方法 首先引用Jquery和下载下来的js,css ~~~ <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="/js/jquery.bxslider.min.js"></script> <link href="/lib/jquery.bxslider.css" rel="stylesheet" /> ~~~ html基础代码 ~~~ <ul class="bxslider"> <li><img src="/images/pic1.jpg" /></li> <li><img src="/images/pic2.jpg" /></li> <li><img src="/images/pic3.jpg" /></li> <li><img src="/images/pic4.jpg" /></li> </ul> ~~~ body之前初始化代码,详细参数参见http://bxslider.com/options ~~~ $(document).ready(function(){ $('.slider1').bxSlider({ slideWidth: 200, minSlides: 2, maxSlides: 3, slideMargin: 10 }); }); ~~~ **网站里有个案例页面,看看你需要什么效果,然后去找http://bxslider.com/examples**