Paginathing
Paginate Everything (support BootstrapCSS)
a dead-simple jQuery plugin for paginate your html elements. DEMO
How the plugin's work? Originally paginathing.js hide all your selector's children dom. Then shows the dom based on active pages by using jQuery .show()
Requirements
- jQuery
Usage
Your html markup (example)
<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> </div>Include jQuery & paginathing first
<!-- jQuery first --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- paginathing.js --> <script type="text/javascript" src="paginathing.js"></script>Initialize
<!-- Your script --> <script type="text/javascript"> jQuery(document).ready(function($){ $('.list-group').paginathing({ perPage: 2, containerClass: 'panel-footer' }) }); </script>Available Options
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 License
paginathing.js is licensed under MIT
