Paginathing 前台分页jQuery插件

<script src="path/to/jquery.min.js"></script>

<script src="path/to/paginathing.js.js"></script>

<div class="panel panel-primary">

  <div class="panel-heading">

    <h3 class="panel-title">List of item.</h3>

  </div>

  <ul class="list-group">

    <li class="list-group-item"> Your Item 1</li>

    <li class="list-group-item"> Your Item 2</li>

    <li class="list-group-item"> Your Item 3</li>

    <li class="list-group-item"> Your Item 4</li>

    <li class="list-group-item"> Your Item 5</li>

    <li class="list-group-item"> Your Item 6</li>

  </ul>

</div>

<script type="text/javascript">

  jQuery(document).ready(function($){

    $('.list-group').paginathing({

          perPage: 2,

          containerClass: 'panel'

    })

  });

</script>

perPage: 10, // show item per page

limitPagination: false, // false or number. Limiting your pagination number.

prevNext: true, // enable previous and next button

firstLast: true, // enable first and last button

prevText: '«', // Previous button text

nextText: '»', // Next button text

firstText: 'First', // "First button" text

lastText: 'Last', // "Last button" text

containerClass: 'pagination-container', // extend default container class

ulClass: 'pagination', // extend default ul class

liClass: 'page', // extend li class

activeClass: 'active', // active link class

disabledClass: 'disable' // disabled link class,

insertAfter: null //class or id (eg: .element or #element). append the paginator after certain element

pageNumbers: false // showing current page number of total pages number, to work properly limitPagination must be true