jQuery插件bxSlider實(shí)現(xiàn)響應(yīng)式焦點(diǎn)圖
優(yōu)秀響應(yīng)式j(luò)Query焦點(diǎn)圖插件bxSlider,優(yōu)秀響應(yīng)式布局設(shè)計(jì)jQuery插件,自適
應(yīng)任何設(shè)備,切換內(nèi)容可以是視頻、圖片、HTML、支持觸摸設(shè)備,自定義函數(shù)
callback,支持眾多的參數(shù)自定義配置,瀏覽器支持Firefox, Chrome, Safari,
iOS, Android, IE7+。
使用方法:
1. 加載jQuery和插件
<!-- jQuery library (served from Google) --> <script src="jquery/1.8.2/jquery.min.js"></script> <!-- bxSlider Javascript file --> <script src="/js/jquery.bxslider.min.js"></script> <!-- bxSlider CSS file --> <link href="/lib/jquery.bxslider.css" rel="stylesheet" />
2.HTML內(nèi)容
<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>
3.函數(shù)調(diào)用
$(document).ready(function(){ $('.bxslider').bxSlider(); });
函數(shù)選項(xiàng)配置請自定義配置。
查看DEMO 官網(wǎng)下載
以上所述就是本文的全部內(nèi)容了,希望大家能夠喜歡
- jQuery實(shí)現(xiàn)的自適應(yīng)焦點(diǎn)圖效果完整實(shí)例
- jQuery焦點(diǎn)圖左右轉(zhuǎn)換效果
- 輕量級jQuery插件slideBox實(shí)現(xiàn)帶底欄輪播(焦點(diǎn)圖)代碼
- 基于JQuery實(shí)現(xiàn)圖片輪播效果(焦點(diǎn)圖)
- jQuery插件實(shí)現(xiàn)帶圓點(diǎn)的焦點(diǎn)圖片輪播切換
- 基于Jquery實(shí)現(xiàn)焦點(diǎn)圖淡出淡入效果
- jQuery右側(cè)選項(xiàng)卡焦點(diǎn)圖片輪播特效代碼分享
- jQuery焦點(diǎn)圖輪播效果實(shí)現(xiàn)方法
- 基于jquery實(shí)現(xiàn)輪播焦點(diǎn)圖插件
- jquery實(shí)現(xiàn)自適應(yīng)banner焦點(diǎn)圖
相關(guān)文章
jqueryMobile 動(dòng)態(tài)添加元素,展示刷新視圖的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猨queryMobile 動(dòng)態(tài)添加元素,展示刷新視圖的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05jQuery+canvas實(shí)現(xiàn)的球體平拋及顏色動(dòng)態(tài)變換效果
這篇文章主要介紹了jQuery+canvas實(shí)現(xiàn)的球體平拋及顏色動(dòng)態(tài)變換效果,通過jQuery結(jié)合html5的canvas技術(shù)調(diào)用時(shí)間函數(shù)實(shí)時(shí)進(jìn)行數(shù)學(xué)運(yùn)算,最終實(shí)現(xiàn)球體平拋及顏色動(dòng)態(tài)變換的效果,需要的朋友可以參考下2016-01-01jquery實(shí)現(xiàn)Ajax請求的幾種常見方式總結(jié)
這篇文章主要介紹了jquery實(shí)現(xiàn)Ajax請求的幾種常見方式,結(jié)合實(shí)例形式總結(jié)分析了jQuery實(shí)現(xiàn)ajax請求常用的load()、post()、get()及Ajax()方法相關(guān)操作技巧,需要的朋友可以參考下2019-05-05用戶管理的設(shè)計(jì)_jquery的ajax實(shí)現(xiàn)二級聯(lián)動(dòng)效果
下面小編就為大家?guī)硪黄脩艄芾淼脑O(shè)計(jì)_jquery的ajax實(shí)現(xiàn)二級聯(lián)動(dòng)效果。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07jquery實(shí)現(xiàn)仿新浪微博評論滾動(dòng)效果
這篇文章主要介紹了jquery實(shí)現(xiàn)仿新浪微博評論滾動(dòng)效果,基于jquery實(shí)現(xiàn)頁面圖文定時(shí)滾動(dòng)效果,涉及jquery頁面元素的遍歷與樣式的動(dòng)態(tài)操作技巧,是一款經(jīng)典的jquery滾動(dòng)特效,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08jquery實(shí)現(xiàn)的一個(gè)導(dǎo)航滾動(dòng)效果具體代碼
首頁有一個(gè)導(dǎo)航頁面要實(shí)現(xiàn)滾動(dòng)效果,索性就仿造別人的效果自己做了一個(gè),大體上還行,看起來還是比較流暢的,現(xiàn)滾動(dòng)效果,腳本代碼如下,感興趣的朋友可以參考下2013-05-05jQuery基于擴(kuò)展簡單實(shí)現(xiàn)倒計(jì)時(shí)功能的方法
這篇文章主要介紹了jQuery基于擴(kuò)展簡單實(shí)現(xiàn)倒計(jì)時(shí)功能的方法,涉及jQuery擴(kuò)展與回調(diào)函數(shù)的相關(guān)使用技巧,需要的朋友可以參考下2016-05-05