<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX Javascript CSS 分页代码</title>
</head>
<body>
<style type="text/css">
DIV.atao_Page {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-SIZE: 0.85em; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; font-family:Verdana;/*FONT-FAMILY: Tahoma,Helvetica,sans-serif;*/ TEXT-ALIGN: center;}
DIV.atao_Page A {BORDER-RIGHT: #ccdbe4 1px solid; PADDING-RIGHT: 8px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ccdbe4 1px solid; PADDING-LEFT: 8px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccdbe4 1px solid; COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccdbe4 1px solid; TEXT-DECORATION: none;}
DIV.atao_Page A:hover {BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4;}
DIV.atao_Page A:active {BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4;}
DIV.atao_Page SPAN.current {BORDER-RIGHT: #ccdbe4 1px solid; PADDING-RIGHT: 8px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ccdbe4 1px solid; PADDING-LEFT: 8px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccdbe4 1px solid; COLOR: #000000;FONT-WEIGHT: bold; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccdbe4 1px solid; TEXT-DECORATION: none;}
DIV.atao_Page A.disabled {DISPLAY: none;}
DIV.atao_Page A.next {BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 0px 0px 10px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid;}
DIV.atao_Page A.next:hover {BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid;}
DIV.atao_Page A.prev {BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 10px 0px 0px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid;}
DIV.atao_Page A.prev:hover {BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid;}
</style>
<div id="pageinfo" class="atao_Page"></div>
<script language="javascript" type="text/javascript">
<!--
// Author : 程序人生 , 涛の仔セ↗ , www.531.hk
// Created : 2010.03.02
function _page(page,Tcount) {
var _pSize = 10;
var _Tpage = parseInt((Tcount + _pSize - 1) / _pSize);
var sPage = page - 5;
var ePage = page + 5;
if (sPage < 1) sPage = 1;
if (page < 7){sPage = 1; ePage = 10;}
if (ePage > _Tpage) {sPage = _Tpage - 9; ePage = _Tpage; }
if (ePage < 11) sPage = 1;
var sStr = "<a href=\"javascript:void(0);\" onclick=\"javascript:_page(1," + Tcount + ");\"><<</a>";
var eStr = "<a href=\"javascript:void(0);\" onclick=\"javascript:_page(" + _Tpage + "," + Tcount + ");\">>></a>";
if (page < 2) sStr = "";
if (page == _Tpage) eStr = "";
var strPage = "";
for (i = sPage; i <= ePage; i++)
{
var strTemp = "<a href=\"javascript:void(0);\" onclick=\"javascript:_page(" + i + "," + Tcount + ");\">" + i + "</a>";
if (i == page) strTemp = "<span class=\"current\">" + i + "</span>";
strPage += strTemp;
}
document.getElementById("pageinfo").innerHTML = sStr + strPage + eStr;
}
_page(1,999);
//-->
</script>
</body>
</html>