KW Online Tools Zone
Knowledge Walls
View All Tools Home
PAGANTIONNEXTPREV
[Jquery editor]
Run
Share Link
Clear
HTML [Ctrl+Enter] - to run
Abi
Anant
balraj
devi
manasha
mani
nimmi
god
gopal
Abi
Anant
balraj
devi
manasha
mani
nimmi
god
gopal
Abi
Anant
balraj
devi
manasha
mani
nimmi
god
gopal
prev
next
CSS [Ctrl+Enter] - to run
.prev{ display:none; float:left; margin:5px 10px; } #divPages{ float:left; } #divPages div{ float:left; margin:5px 10px; } .next{ float:left; margin:5px 10px; }
Jquery [Ctrl+Enter] - to run
$(document).ready(function(){ var totalrows = $(".divControl").length; var pageSize=4; var noOfPage = totalrows/pageSize; noOfPage = Math.ceil(noOfPage); for(var i=1;i<=noOfPage;i++) { $("#divPages").append('
'+i+'
'); } var totalPagenum = $("div.page").length; if(totalPagenum >2) { $("div.page").hide(); for(var n=1;n<=2;n++) { $("div.page:nth-child("+n+")").show(); } } else{ $("div.next").hide(); $("div.prev").hide(); } $("div.divControl").hide(); for(var j=1;j<=pageSize;j++) { $("div.divControl:nth-child("+j+")").show(); } displayevent(); $("div.next").click(function(){ if($("div.selected:last").nextAll('div.page').length > 2) { $("div.selected").last().nextAll(':lt(2)').show(); $("div.selected").hide(); displayevent(); //lastposevent(); $("div.prev").show(); $("div.next").show(); } else{ $("div.selected").last().nextAll().show(); $("div.selected").hide(); displayevent(); $("div.next").hide(); $("div.prev").show(); } }); $("div.prev").click(function(){ if($("div.selected:first").prevAll('div.page').length > 2) { $("div.selected").first().prevAll(':lt(2)').show(); $("div.selected").hide(); $("div.prev").show(); $("div.next").show(); displayevent(); } else{ $("div.selected").first().prevAll().show(); $("div.selected").hide(); $("div.prev").hide(); $("div.next").show(); displayevent(); } }); $("div.page").click(function(){ var currentPage = $(this).text(); $("div.divControl").hide(); for (var k = (currentPage * pageSize) - (pageSize-1); k <= (currentPage * pageSize); k++) { $("div.divControl:nth-child("+k+")").show(); } }); }); function displayevent() { $("div.page").each(function(){ if( $(this).css('display') === 'block') { $(this).addClass('selected'); } else{ $(this).removeClass('selected'); } }); }
OUTPUT
Copyright © 2021 Knowledge walls, All rights reserved
Copyright © 2021 Knowledge walls, All rights reserved