New to Kendo UI for jQuery? Start a free 30-day trial
Responsive Design
The Kendo UI for jQuery Pager is designed to automatically adjust its layout and visible elements based on the available width, ensuring a smooth experience across desktops, tablets, and mobile devices. No manual configuration is needed—responsiveness is enabled by default, but you can turn it off using the responsive
property.
How Responsiveness Works
As the Pager's width changes, it adapts by showing or hiding certain controls to maintain usability:
- 600px and above: All Pager features are visible, including the page size dropdown, numeric page buttons, and info label.
- 480–599px: The info label is hidden, but navigation and page size controls remain accessible.
- 360–479px: The page selector switches to a native dropdown for compactness, and both the page size dropdown and info label are hidden.
- Below 360px: Only the essential page selector (dropdown) is shown for maximum space efficiency.
This responsive behavior ensures that users can easily navigate and interact with the Pager, regardless of device or screen size.