文章目录[隐藏]
- 要实现上面的效果，我么加载 jQuery 和 bxSilder 的代码之后，还需要在页面的 head 中添加如下的 jQuery 代码：
$(document).ready(function(){ $('#example3').bxSlider({ mode: 'fade', speed: 3000, next_text: '下一张', prev_text: '上一张', width: 307, wrapper_class: 'example3_container' });});其他的效果请查看 bxSlider 的演示页面。
bxSlider 详细配置参数
bxSlider 有以下参数可以进行配置：
- mode: 模式，可以指定 ‘slide’, ‘fade’, ‘ticker’ 这三种模式。
- speed: 速度，变换的时间，单位是毫秒。
- auto: 是否自动变换。
- controls: 用于添加按钮来进行手动变化，（可以和 auto 混合一起使用）。
- pause: 两次变换之间停留的时间（在 auto 为 true 才有效）。
- width: 容器元素的宽度（单位是像素）。
- prev_text: 上一个按钮的问本。
- next_text: 下一个按钮的文本。
- prev_img: 上一个按钮的图片。
- next_img: 下一个按钮的图片。
- ticker_direction: 滚动的方向，模式为 ‘ticker’ 才有效。
- wrapper_class: 容器元素的 class 名字。
下载：bxSlider
好资源 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明jQuery 图片翻页(幻灯片)效果小插件: bxSlider！
