Jquery bxslider是一款非常棒的圖片輪播插件,但是要想讓其完美地運作,你需要熟練地掌握bxslider參數的使用。下面是一些常用的bxslider參數。
$(document).ready(function(){ $('.bxslider').bxSlider({ mode: 'horizontal', speed: 1200, captions: true, auto: true, pause: 5000, pager: true, controls: true, touchEnabled:true, swipeThreshold:50 }); });
mode:表示輪播的方式,有水平和垂直兩種方式。horizontal(默認)表示水平,vertical表示垂直。
speed:表示輪播的速度,以毫秒為單位。默認值是500ms。
captions:表示是否顯示圖像下方的標題。默認值為false。
auto:表示是否自動輪播。默認為true。
pause:表示停頓時間,以毫秒為單位,當auto:true時生效。默認值為4000ms。
pager:表示是否顯示分頁器。分頁器純css實現,可選擇樣式以及位置。默認為false。
controls:表示是否顯示前后箭頭控件。默認為false。
touchEnabled:表示是否開啟滑屏手勢操作,默認為true。
swipeThreshold:表示手指滑動可以認為是輪播原理,然后執行輪播的一個閾值。默認為50。
好了,以上就是一些常用的bxslider參數,熟練掌握它們,相信你一定可以制作出令人驚嘆的輪播效果。祝你成功!
上一篇只寫html不寫css
下一篇只有ie8識別的css