Rundiz Pagination.JS

JavaScript Pagination.
The highly customizable JS pagination class.

Example:
All HTML you need.

<nav class="rd-pagination" aria-label="Page navigation example"></nav>
<script src="assets/js/rd-pagination.js"></script>

All JavaScript you need.

const rdPagination = new RdPagination('.rd-pagination', {
    base_url: '?start=%PAGENUMBER%',
    page_number_value: 0,
    total_records: 195,
});
rdPagination.createLinks();

That's all. See more samples in folder tests/samples.

Samples

• Sample 1 use offset query string.
• Sample 2 use page number query string.
• Sample 3 use different selector.
• Sample 4 full options.
• Sample 5 use pre-set style class.
• Sample 6 use AJAX. (Please download and try it from your server.)
• Sample 7 use multiple pagination.
• Sample 8 use custom design.

Pagination parts description

This repository ported from Rundiz Pagination. So, I will use image from that.

• "before unavailable" items number can be set via unavailable_before option. Example: {unavailable_before: 1}
• "unavailable" text can be set via unavailable_text option. Example: {unavailable_text: '..'}
• "adjacent pages" can be set the number via number_adjacent_pages option. Example: {number_adjacent_pages: = 3}
• "after unavailable" items number can be set via unavailable_after option. Example: {unavailable_after: 2}
• Read more in JS class constructor on options argument.

Options