Unslider 是一款支援鍵盤操作 (可左右鍵切換) , 並且具備響應式設計 , 會隨著視窗大小自動調整slider圖片比例 , 最驚人的是它的js檔案只有小小的6KB (min版的只有3KB) , 是一款高度優化的JQUERY功能套件 , 非常推薦網站使用 !
先在頂頭(head)引入JQ程式庫以及JS功能檔案, 檔案路徑請自行調整 , 以下範例是以根目錄為路徑：
- <script src="jquery.min.js"></script>
- <script src="unslider.js"></script>
- 或是
- <script src="unslider.min.js"></script>
- <div class="banner">
- <ul>
- <li>This is slider1.</li>
- <li>This is slider2.</li>
- <li>This is slider3.</li>
- </ul>
- </div>
JS功能設定部分：- $('.banner').unslider({
- speed: 500, // 切換時的動畫速度
- delay: 3000, // 每個SLIDER的延遲時間
- complete: function() {}, // 可以針對每個SLIDER完成後寫入個別動作指令
- keys: true, // 是否開啟左右鍵鍵盤控制
- dots: true, // 是否顯示Slider導覽點
- fluid: false // 支援響應式網站設計 , 開啟後有可能會在非響應式網站中出現問題
- });
jquery unlider範例.rar
(594.18 KB, 下載次數: 35)
|
喜歡
Anything Zoomer 快速製作圖片或文字放大鏡效果
Cloud Zoom 具有四種強大展示效果的圖片放大鏡JQuery套件
