Responsive Paginate turns a bunch of HTML anchor tags into a responsive pagination UI. Check out a demo here:
Requires jQuery.
<head>
...
<link href="responsivePaginate.css" rel="stylesheet" media="screen">
</head>
<div class="responsivePaginate">
<a href="/view/?page=1">1</a>
<a href="/view/?page=2">2</a>
<a href="/view/?page=3" data-selected="true">3</a>
...
<a href="/view/?page=n">n</a>
</div>
Using numbers isn't required, you can use whatever labels you want. To tell responsivePaginate which page should be marked selected, add 'data-selected="true"' to its anchor tag.
...
<script src="http://code.jquery.com/jquery.js"></script>
<script src="responsivePaginate.js"></script>
<script>
$(document).ready(function () {
$(".responsivePaginate").responsivePaginate();
});
</script>
</body>
</html>
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent