Lightweight Any Element Pagination Plugin With jQuery - easyPaginate

easyPaginate.js is a lightweight jQuery plugin that provides an easy way to paginate any group of DOM elements on your web page. With several useful options to customize the animations, pagination controls and more.

Installation:

# NPM
$ npm install jquery.easyPaginate --save

# Bower
$ bower install jquery.easyPaginate

How to use it:

1. Add a group of html elements to the pagination container.

<div id="easyPaginate">
  <img src="1.jpg">
  <img src="2.jpg">
  <img src="3.jpg">
  ...
</div>

2. Put jQuery library and the easyPaginate.js script at the bottom of the webpage.

$('#easyPaginate').easyPaginate({
  paginateElement: 'img'
});

3. Specify hown many elements per page.

$('#easyPaginate').easyPaginate({
  paginateElement: 'img',
  elementsPerPage: 10
});

4. Config the animation when you paginate between elements.

$('#easyPaginate').easyPaginate({

  // 'default', 'fade', 'slide', 'climb'
  effect: 'default'

});

5. Customize the pagination links/buttons.

$('#easyPaginate').easyPaginate({

  firstButton: true,
  firstButtonText: '<<',
  lastButton: true,
  lastButtonText: '>>',        
  prevButton: true,
  prevButtonText: '<',        
  nextButton: true,
  nextButtonText: '>'

});

---

This awesome jQuery plugin is developed by st3ph. For more Advanced Usages, please check the demo page or visit the official website.