JavaScript

Use jQuery to Generate Quick Pagination

Sam Deering
Share

From time to time, SitePoint removes years-old demos hosted on separate HTML pages. We do this to reduce the risk of outdated code with exposed vulnerabilities posing a risk to our users. Thank you for your understanding.

Use Quick jQuery Pagination to convert long lists and page content into numbered pages in seconds!

Download

Benefits of quick pagination

  • Can be used on any list in seconds
  • You can specify navigation on top, bottom or both
  • You can specify the number of items to display for each page
  • Very lightweight, only 3kb!
  • I’ve tested in on every browser and it is very stable

Disadvantages to similar pagination plugins

  • It currently only works on lists (but you can use it on divs you would have to put them in li tags).
  • It currently doesn’t have back and next buttons.

Example Usage 1

Default options 10 list items per page and page navigation at bottom.

$("ul.pagination1").quickPagination();

Example Usage 2

Default options 10 list items per page and page navigation at top and bottom.

$("ul.pagination2").quickPagination({pagerLocation:"both"});

Example Usage 3

Specified 3 list items per page and page navigation at top and bottom.

$("ul.pagination3").quickPagination({pagerLocation:"both",pageSize:"3"});