长文章分页代码，页码可以随鼠标移动和当前所在页码变色

长文章分页代码，页码可以随鼠标移动和当前所在页码变色，常见于门户网站的时尚娱乐总结类文章，比如：

php代码一览

<link href="textpage.css" rel="stylesheet" type="text/css"/>
<script>
     $(function(){
     $(".enable").hover(function(){
        $(this).css({"background-color":"#ffffff","cursor":"pointer","text-decoration": "underline"})
     },
     function(){
        $(this).css({"background-color":"#B5D5FE","cursor":"default","text-decoration": "none"})
        }
    );
    });
     </script> 

<div class="iclcc-teacher-page">
    <table cellspacing="5px">
        <tbody>
            <tr>
<?php 
$str = "测试1[NextPage]测试2[NextPage]测试3[NextPage]测试4[NextPage]测试5[NextPage]测试6"; 
//测试用的字符串
if(empty($_REQUEST['page'])){
    $_REQUEST['page'] = 1;
}
//接收页码，如果接收到的页码为空值，默认此页为第一页
$page = $_REQUEST['page'];
//如果接收到的页码非空值，此页数等于接收到的页码
$arr = explode("[NextPage]",$str); 
//把字符串用关键字进行分割 
if(count($arr)==1){ 
 echo $str; 
//如果字符串被分割成为1段，那么直接输出字符串
}else{  
 echo $arr[$page-1]; 
//如果字符串被分割为1段以上，那么输出当前页码的字符串
 echo "<br/>"; 
 //换行
 if($page == 1){   
 echo '<td class="disabled"><a>首页</a></td>';
 //如果现在处于首页，则首页发白无法点击
 echo '<td class="disabled"><a>上一页</a></td>';
 //如果现在处于首页，则上一页发白无法点击
 }else{
 echo '<td class="enable"><a href="?page=1">首页</a></td>';
 //如果处于既非首页也非末页，则首页变色，可以点击
 echo '<td class="enable"><a href="?page=';
 echo $page-1;
 echo '">';
 echo "上一页";
 echo '</a></td>';
 //如果现在处于既非首页也非末页，则上一页变色，可以点击
 }

 for($i=1;$i<=count($arr);$i++){
 if($page == $i){
 echo '<td class="disabled">';
 echo "<a>$i</a>";
 echo '</td>';
//如果处于当前页，输出页码，页码发白无法点击 
 }else{
 echo '<td class="enable"><a href="?page=';
 echo "$i";
 echo '">';
 echo "$i";
 echo '</a></td>';
//如果未处于当前页，输出页码，页码变色可以点击 
 } 
 } 
 if($page == count($arr)){     
 echo '<td class="disabled"><a>下一页</a></td>';
 //如果现在处于尾页，则下一页发白无法点击
 echo '<td class="disabled"><a>尾页</a></td>';
 //如果现在处于既非首页也非尾页，则下一页变色可以点击
 }else{
 echo '<td class="enable"><a href="?page=';
 echo $page+1;
 echo '">';
 echo "下一页";
 echo '</a></td>';
 //如果现处于尾页，则尾页发白无法点击
 echo '<td class="enable"><a href="?page=';
 echo count($arr);
 echo '">';
 echo "尾页";
 echo '</a></td>';
 }
 //如果现在处于既非首页也非尾页，则尾页变色可以点击  
} 
?>
</tr>
    </tbody>
        </table>
        </div>

css代码一览

.iclcc-teacher-page table{
    margin: 0 auto;
    text-decoration: none;
}

.iclcc-teacher-page tr td {
    padding: 10px;
    line-height: 10px;
    font-size: 15px;
    border-color: #3266CC;
    border-width: 1px;
    border-style: solid;
    text-decoration: none;  
}

.iclcc-teacher-page table tr td a{
    text-decoration: none;
    color: #363636;
}

.iclcc-teacher-page table tr td a:hover{
    text-decoration: none;
    color: #363636;
}

.disabled{
    background-color: #ffffff;
}

.enable{
    background-color: #B5D5FE;  
}

以下是我自己的效果