Pagination V04

Author: Colorlib

Released: September 2026

License: CC BY 3.0

A floating toolbar for a 42-page document viewer with first, previous, next and last buttons around a small "Page [7] of 42" field. Typing a page number and pressing Enter or Go jumps straight to it, while empty, non-numeric or out-of-range values show an error that is announced and linked to the field. Arrow Up and Down in the field step through the pages.

It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 532 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.

• Jump-to-page form with inline validation and aria-invalid
• Error message in a role=alert region tied to the field with aria-describedby
• First, previous, next and last buttons with accessible names and disabled states
• Page changes announced in a polite status region
• Arrow Up and Down step pages from the field