分享5种风格的 jQuery 分页效果【附代码】

　　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();
                                  }
    });
});