jQuery实现仿腾讯视频列表分页效果的方法

本文实例讲述了jQuery实现仿腾讯视频列表分页效果的方法。分享给大家供大家参考。具体如下：

这里使用jQuery仿腾讯视频列表分页效果，无刷新分页特效，点击分页按钮，无刷新进入下一页内容列表。

运行效果截图如下：

具体代码如下：

.main{width:800px;zoom:1;margin:0 auto;}
.item{width:800px;overflow:hidden;}
ul{padding:0;width:860px;zoom:1;}
.clear{zoom:1;}
.clear:after{content:"";display:block;height:0;clear:both;visibility:hidden;}
ul li{list-style-type:none;float:left;background:#F69;font-size:60px;text-shadow:1px 1px 3px #555;width:380px;height:200px;margin:10px 40px 10px 0;line-height:200px;text-align:center;color:#fff;}
.page_btn{padding-top:20px;}
.page_btn a{cursor:pointer;padding:5px;border:solid 1px #ccc;font-size:12px;}
.page_box{float:right;}
.num{padding:0 10px;}






 
  

   
1
   
2
   
3
   
4
   
5
   
6
   
7
   
8
   
9
   
10
   
11
   
12
   
13
   
14
   
15
   
16
   
17
   
18
   
19
   
20
   
21
   
22
   
23
   
24
   
25
   
26
   
27
   
28
  
 
 
  
   上一页1/下一页
  
 

希望本文所述对大家的jquery程序设计有所帮助。