标签:style blog http color io os 使用 ar java
jPaginate 是一款非常精致的分页插件,提供了五种不同风格的分页效果,支持鼠标悬停翻页,快速分页功能。这款插件还提供了丰富的配置选项,你可以根据需要进行设置。
各个效果的使用示例代码:
$(function() { $("#demo1").paginate({ count : 100, start : 1, display : 8, 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‘ }); $("#demo2").paginate({ count : 50, start : 5, display : 10, border : false, text_color : ‘#888‘, background_color : ‘#EEE‘, text_hover_color : ‘black‘, background_hover_color : ‘#CFCFCF‘ }); $("#demo3").paginate({ count : 50, start : 20, display : 12, border : true, border_color : ‘#BEF8B8‘, text_color : ‘#68BA64‘, background_color : ‘#E3F2E1‘, border_hover_color : ‘#68BA64‘, text_hover_color : ‘black‘, background_hover_color : ‘#CAE6C6‘, rotate : false, images : false, mouse : ‘press‘ }); $("#demo4").paginate({ count : 50, start : 20, display : 12, border : false, text_color : ‘#79B5E3‘, background_color : ‘none‘, text_hover_color : ‘#2573AF‘, background_hover_color : ‘none‘, images : false, mouse : ‘press‘ }); $("#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(); } }); });
编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
标签:style blog http color io os 使用 ar java
原文地址:http://www.cnblogs.com/lhb25/p/5-great-juqery-pagination-effect.html