jPaginate: A Fancy jQuery Pagination Plugin
📅 — 👀 826 — 👦Tìm tòi trên Inter, thấy plugin dàn trang cho các item này khá hay và đẹp nên đánh dấu tại đây, khi cần xem lại.
jPaginate is a jQuery pagination plugin that comes with a twist: animated page numbers. The user can slide through the available page numbers by clicking or just hovering over the arrows. Shortlinks to the first and last page are available as well.
You can call the plugin in the following way:
$(elementID).paginate()
You can configure the plugin with the following properties:
count: The total number of pages
start: With which number the visible pages should start
display: How many page numbers should be visible
border: If there should be a border (true/false)
border_color: Color of the border
text_color: Color of the text/numbers
background_color: Background color
border_hover_color: Border color when hovering
text_hover_color: Text color when hovering
background_hover_color: Background color when hovering
images: If the arrows should be images or not (true/false)
mouse: With value “press” the user can keep the mouse button pressed and the page numbers will keep on sliding. With value “slide” the page numbers will slide once with each click.
onChange: The callback function when clicking on a page. As argument the number of the page clicked can be used.
Example:
$("#demo5").paginate({
count : 10,
start : 1,
display : 7,
border : true,
border_color : '#fff',
text_color : '#fff',
background_color : 'black',
border_hover_color : '#ccc',
text_hover_color : '#000',
background_hover_color : '#fff',
images : false,
mouse : 'press',
onChange : function(page){
$('._current','#paginationdemo').removeClass('_current').hide();
$('#p'+page).addClass('_current').show();
}
});
📁 Code Demo
🔖