實(shí)例代碼詳解jquery.slides.js
Slides – 是一個(gè)簡(jiǎn)單的,容易定制和風(fēng)格化,的jQuery幻燈片插件。
Slides提供褪色或幻燈片過(guò)渡效果,圖像淡入淡出,圖像預(yù)壓,自動(dòng)生成分頁(yè),循環(huán),自動(dòng)播放的自定義等很多選項(xiàng)。
用Slides插件,你可以隨機(jī)播放幻燈片,設(shè)定那一套您想要開(kāi)始幻燈片。它附帶充分的說(shuō)明和示例。
廢話(huà)不多說(shuō)了,直接給大家貼代碼了
$(function(){ $("#slides").slidesjs({ play: { active: true, // [boolean] Generate the play and stop buttons. // You cannot use your own buttons. Sorry. effect: "slide", // [string] Can be either "slide" or "fade". interval: , // [number] Time spent on each slide in milliseconds. auto: false, // [boolean] Start playing the slideshow on load. swap: true, // [boolean] show/hide stop and play buttons pauseOnHover: false, // [boolean] pause a playing slideshow on hover restartDelay: // [number] restart delay on inactive slideshow } }); });
前臺(tái):
<!doctype html> <head> <style> /* Prevents slides from flashing */ #slides { display:none; } </style> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script src="jquery.slides.min.js"></script> <script> $(function(){ $("#slides").slidesjs({ width: , height: }); }); </script> </head> <body> <div id="slides"> <img src="http://placehold.it/x"> <img src="http://placehold.it/x"> <img src="http://placehold.it/x"> <img src="http://placehold.it/x"> <img src="http://placehold.it/x"> </div> </body>
以上內(nèi)容是關(guān)于jquery.slides.js的全部代碼,希望大家喜歡。
相關(guān)文章
使用jQuery加載html頁(yè)面到指定的div實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇使用jQuery加載html頁(yè)面到指定的div實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-07jQuery插件Validate實(shí)現(xiàn)自定義表單驗(yàn)證
這篇文章主要介紹了jQuery插件Validate實(shí)現(xiàn)自定義表單驗(yàn)證,自定義一個(gè)驗(yàn)證方法,感興趣的小伙伴們可以參考一下2016-01-01jQuery操作select下拉框的text值和value值的方法
這篇文章主要介紹了jQuery操作select下拉框的text值和value值的方法,需要的朋友可以參考下2014-05-05jQuery復(fù)制節(jié)點(diǎn)用法示例(clone方法)
這篇文章主要介紹了jQuery復(fù)制節(jié)點(diǎn)的方法,結(jié)合實(shí)例形式分析了clone方法復(fù)制節(jié)點(diǎn)及appendTo方法追加節(jié)點(diǎn)的相關(guān)操作技巧,需要的朋友可以參考下2016-09-09淺談jQuery中ajaxPrefilter的應(yīng)用
下面小編就為大家?guī)?lái)一篇淺談jQuery中ajaxPrefilter的應(yīng)用。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08jQuery圖片前后對(duì)比插件beforeAfter用法示例【附demo源碼下載】
這篇文章主要介紹了jQuery圖片前后對(duì)比插件beforeAfter用法,結(jié)合實(shí)例形式分析了beforeAfter插件的功能、參數(shù)用法與使用技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2016-09-09jQuery中jqGrid分頁(yè)實(shí)現(xiàn)代碼
今天看到j(luò)avaeye上有人使用了jqGrid實(shí)現(xiàn)了數(shù)據(jù)的分頁(yè),參考它的代碼,實(shí)現(xiàn)了這個(gè)功能,搬出來(lái)曬曬,作為自己以后學(xué)習(xí)的資料2011-11-11jQuery實(shí)現(xiàn)碰到邊緣反彈的動(dòng)畫(huà)效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)碰到邊緣反彈的動(dòng)畫(huà),非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2018-02-02JQuery插件iScroll實(shí)現(xiàn)下拉刷新,滾動(dòng)翻頁(yè)特效
下拉自動(dòng)加載進(jìn)行分頁(yè)的運(yùn)用越來(lái)越多,比起傳統(tǒng)的分頁(yè)該方法分頁(yè)用戶(hù)體驗(yàn)更好,布局也更簡(jiǎn)單了。目前正在使用和學(xué)習(xí)中……2014-06-06