超好用的jQuery分頁(yè)插件jpaginate用法示例【附源碼下載】
本文實(shí)例講述了jQuery分頁(yè)插件jpaginate用法。分享給大家供大家參考,具體如下:
jpaginate是一個(gè)自帶滑動(dòng)動(dòng)畫效果的jQuery分頁(yè)插件,用戶可以通過(guò)單擊或只是懸停在箭頭上的使頁(yè)碼滑動(dòng)顯示。
你可以用下面的方式調(diào)用插件:
$(elementID).paginate()
您可以通過(guò)一下屬性來(lái)配置插件:
count:頁(yè)面總數(shù)
start:默認(rèn)選中頁(yè)碼
display:可見(jiàn)頁(yè)碼數(shù)量
border:邊框(true/false)
border_color:邊框顏色:
text_color:文本的顏色/號(hào)碼
background_color:背景顏色
border_hover_color:邊框懸停時(shí)顏色
text_hover_color:文本懸停時(shí)顏色
background_hover_color:背景懸停時(shí)顏色
images:箭頭的背景圖片(true/false)
mouse:鼠標(biāo)拿下的動(dòng)畫效果(press/slide)
onChange:當(dāng)點(diǎn)擊一個(gè)網(wǎng)頁(yè)。作為參數(shù),單擊“單擊”的頁(yè)面的數(shù)目可以被使用。
來(lái)個(gè)直接點(diǎn)的代碼,更容易看。
$("#pagination0").paginate({ count : 50, start : 1, display : 7, border : false, text_color : '#888', background_color : '#EEE', text_hover_color : 'black', background_hover_color : '#CFCFCF', rotate : true, images : false, mouse : 'press', onChange : function(page){ list(page-1,pageSize); } });
官方示例的分頁(yè)顯示運(yùn)行效果如下:
jpaginate插件源碼可點(diǎn)擊此處本站下載。
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery擴(kuò)展技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery常見(jiàn)經(jīng)典特效匯總》、《jquery選擇器用法總結(jié)》及《jQuery常用插件及用法總結(jié)》
希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。
- jquery分頁(yè)插件jpaginate在IE中不兼容問(wèn)題
- PHP+jQuery+Ajax實(shí)現(xiàn)分頁(yè)效果 jPaginate插件的應(yīng)用
- jQuery插件jPaginate實(shí)現(xiàn)無(wú)刷新分頁(yè)
- jQuery Pagination Ajax分頁(yè)插件(分頁(yè)切換時(shí)無(wú)刷新與延遲)中文翻譯版
- jquery分頁(yè)插件jquery.pagination.js使用方法解析
- 一款Jquery 分頁(yè)插件的改造方法(服務(wù)器端分頁(yè))
- 最實(shí)用的jQuery分頁(yè)插件
- jQuery Pagination分頁(yè)插件使用方法詳解
- 快速掌握jquery分頁(yè)插件jqPaginator的使用方法
- jQuery ajax分頁(yè)插件實(shí)例代碼
- jquery+css3打造一款ajax分頁(yè)插件(自寫)
相關(guān)文章
jQuery之DOM對(duì)象和jQuery對(duì)象的轉(zhuǎn)換與區(qū)別分析
這篇文章主要介紹了jQuery之DOM對(duì)象和jQuery對(duì)象的轉(zhuǎn)換與區(qū)別分析,對(duì)比分析了DOM對(duì)象和jQuery對(duì)象的原理與用法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01基于jquery實(shí)現(xiàn)點(diǎn)擊左右按鈕圖片橫向滾動(dòng)
點(diǎn)擊左右按鈕圖片橫向滾動(dòng)jquery,一次滾動(dòng)四個(gè),圖片滾動(dòng)完成,自動(dòng)回到第一個(gè)版面,效果相當(dāng)不錯(cuò),感興趣的前端工程師們可以參考下2013-04-04淺談jquery上下滑動(dòng)的注意事項(xiàng)
下面小編就為大家?guī)?lái)一篇jquery上下滑動(dòng)的注意事項(xiàng)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10jQuery ready()和onload的加載耗時(shí)分析
這篇文章主要介紹了jQuery ready()和onload的加載耗時(shí),結(jié)合實(shí)例形式對(duì)比分析了jQuery中的ready()和JavaScript的window.onload進(jìn)行頁(yè)面加載的時(shí)間,需要的朋友可以參考下2016-09-09jQuery Validate表單驗(yàn)證入門學(xué)習(xí)
這篇文章主要介紹了jQuery Validate表單驗(yàn)證入門知識(shí),該插件捆綁了一套有用的驗(yàn)證方法,包括 URL 和電子郵件驗(yàn)證,同時(shí)提供了一個(gè)用來(lái)編寫用戶自定義方法的 API,感興趣的小伙伴們可以參考一下2015-12-12ToolTips JQEURY插件之簡(jiǎn)潔小提示框效果
本來(lái)不想寫成JQ的插件的,不過(guò)貌似不用JQ的話,引用起來(lái)沒(méi)有這么方便。以前也寫過(guò)一些小小的JS方法,但是寫JQ插件是第一次2011-11-11