BootStrap Pagination-PC_20150710
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="http://esimakin.github.io/twbs-pagination/js/jquery.twbsPagination.js"></script>
<div class="page-content" class="well">Page 1 Content</div>
<div class="text-center">
<ul id="pagination-section1" ></ul>
</div>
JavaScript
$(document).ready(function () {
$('#pagination-section1').twbsPagination({
totalPages: "10",
visiblePages: "10",
onPageClick: function (event, page) {
$('.page-content').text('Page ' + page);
}
});
//Category2
$('#pagination-section2').twbsPagination({
totalPages: "3",
visiblePages: "3",
onPageClick: function (event, page) {
$('.page-content').text('Page ' + page);
}
});
//Category3
$('#pagination-section3').twbsPagination({
totalPages: "5",
visiblePages: "5",
onPageClick: function (event, page) {
$('.page-content').text('Page ' + page);
}
});
//Category4
$('#pagination-section4').twbsPagination({
totalPages: "4",
visiblePages: "4",
onPageClick: function (event, page) {
$('.page-content').text('Page ' + page);
}
});
$('#visible-pages-example').twbsPagination({
totalPages: 35,
visiblePages: 10
});
$('.sync-pagination').twbsPagination({
totalPages: 20,
onPageClick: function (evt, page) {
$('#sync-example-page-content').text('Page ' + page);
}
});
});