Simple jQuery Pagination Plugin For Long Lists

A simple jQuery pagination plugin which allows you convert long lists into numbered pages to save page space and improve content readability.

How to use it:

1. Load the paginate.js script after jQuery library but before the closing body tag.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="paginate.js"></script> 

2. Add a pagination component to your long lists.

<div class="pager" id="pager">
  <a href="javascript:void(0);" target="_parent" title="Previous">
    <img src="images/pager-left.png">
  </a>
  <div class="pageNo">Page 1</div>
  <a href="javascript:void(0);" target="_parent" title="Next">
    <img src="images/pager-right.png">
  </a>
</div>

3. Call the function to enable the pagination plugin.

var paginate = $.fn.paginate({

    // list items per page
    perPage  : 3,

    // pagination ul Id
    pageId    : "paginationList", 

    // pager Id
    pager    : "pager",

    // pagination images
    leftImgSrc  : "images/pager-left.png",
    rightImgSrc  : "images/pager-right.png",
    leftImgActiveSrc : "images/pager-left-active.png",
    rightImgActiveSrc : "images/pager-right-active.png",

    // get current page
    getCurrentPage : function(currentPage){
      $(".pageNo").html("Page "+currentPage);
    }
    
});

---

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