Pagination.js可定制的分页组件
Pagination.js 是一个简单、可定制的分页组件。
paginationjs.com
Usage
Normal
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 195], callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Only page numbers
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 100], pageSize: 5, showPrevious: false, showNext: false, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Show "go" input & button
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 40], pageSize: 5, showGoInput: true, showGoButton: true, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Auto hide previous & next button
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 35], pageSize: 5, autoHidePrevious: true, autoHideNext: true, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Mini
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 50], pageSize: 5, showPageNumbers: false, showNavigator: true, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Asynchronous or JSONP
$('#demo').pagination({ dataSource: 'https://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?', locator: 'items', totalNumber: 120, pageSize: 20, ajax: { beforeSend: function(){ dataContainer.html('Loading data from flickr.com ...'); } }, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Specify default
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 35], pageSize: 5, pageNumber: 3, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Format result data
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 100], pageSize: 8, formatResult: function(data){ var result = []; for(var i = 0, len = data.length; i < len; i++){ result.push(data[i] + ' - good guys'); } return result; }, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Another format result data
$('#demo').pagination({ dataSource: [{a :1}, {a :2}, {a :3}, {a :4}, ... , {a :50}], pageSize: 8, formatResult: function(data){ for(var i = 0, len = data.length; i < len; i++){ data[i].a = data[i].a + ' - bad guys'; } }, callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Format navigator
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 15], pageSize: 5, showNavigator: true, formatNavigator: '<span style="color: #f00"><%= currentPage %></span> st/rd/th, <%= totalPage %> pages, <%= totalNumber %> entries', position: 'top', callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
Format "go" input
$('#demo').pagination({ dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 25], pageSize: 5, showGoInput: true, showGoButton: true, formatGoInput: 'go to <%= input %> st/rd/th', callback: function(data, pagination){ // template method of yourself var html = template(data); dataContainer.html(html); } })
评论
XLPageViewController可定制的分页视图控制器
XLPageViewController 是一个开放、高度可定制化的分页视图控制器。它有以下特点:通
XLPageViewController可定制的分页视图控制器
0
XLPageViewController可定制的分页视图控制器
XLPageViewController是一个开放、高度可定制化的分页视图控制器。它有以下特点:通过基础配置可实现大部分主流App栏目分页效果。也可以通过自定义标题栏样式,实现一些特殊的效果。采用UI
XLPageViewController可定制的分页视图控制器
0
SurfingRefreshControliOS 可定制下拉刷新组件
SurfingRefreshControl是一款iOS可定制任何形状的创意下拉刷新组件。运行环境:Xcode7.3,Swift2.2。易用,轻巧,创意,美观。效果截图:
SurfingRefreshControliOS 可定制下拉刷新组件
0
SurfingRefreshControliOS 可定制下拉刷新组件
SurfingRefreshControl 是一款 iOS 可定制任何形状的创意下拉刷新组件。运行环
SurfingRefreshControliOS 可定制下拉刷新组件
0
Flex-PaginationFlex 分页组件
基于FlexSDK4.6.x+page4as3lib的一套分页组件:PaginationforFlex基于FlexSDK4.6.x;分页逻辑基于page4as3lib;高度定制化分页参数(依照UI/U
Flex-PaginationFlex 分页组件
0
Reactjs-PaginationReact 的本地分页组件
Reactjs-Pagination是一个React的本地分页组件,支持页码、跳转、和迷你模式。文档
Reactjs-PaginationReact 的本地分页组件
0