首页 > 代码库 > 静态页分页效果
静态页分页效果
//分页
(function(){
var cur=1;
$(".newslist li").hide();
var size = $(".newslist li").length;
var page = Math.floor($(".newslist li").length/20)+1;
for(var i=1; i<=page; i++){
$(".page").append(‘<a href="javascript:;">‘+i+‘</a>‘);
}
//默认
$(".page").children("a").eq(0).addClass("cur");
if($(".page").children("a").eq(0).hasClass("cur")){
$(".newslist li:lt(20)").show();
}
//点击
$(".page a").click(function(){
var e=$(this).index();
$(this).addClass("cur").siblings("a").removeClass("cur");
$(".newslist li").hide();
$(".newslist li").slice(20 * e, 20 * e + 20).show();
window.location.href = "http://www.mamicode.com/Media.shtml#" + e;
})
//点详情页后回去 之前的page;
if (window.location.href.indexOf("#") > 1) {
var pageIndex = window.location.href.slice(window.location.href.indexOf("#") + 1, window.location.href.length);
$(".newslist li").hide();
$(".newslist li").slice(20 * pageIndex, 20 * pageIndex + 20).show();
$(".page a").eq(pageIndex).addClass("cur").siblings("a").removeClass("cur");
}
})()