jquery制作搜狐快站页面效果

1. <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> 
2. <script type= src="js/jquery-ui-1.10.3.min.js"></script> 
3. <script type= src="js/jquery.fullPage.js"></script> 
4. <script type=> 
5. $(document).ready(function() { 
6.     $.fn.fullpage({ 
7.         slidesColor: ['#fff', '#fff', '#fff', '#fff', '#fff'], 
8.         anchors: ['page1', 'page2', 'page3', 'page4', 'page5'], 
9.         menu: '#menu' 
10.     }); 
11. }); 
12. </script> 

页面结构：

1. <div id="side">  
2.     <div class="inner"> 
3.         <div class="hgroup"> 
4.             <h1><a href="http://www.aseoe.com/">搜狐快站a>h1> 
5.             <h2>专业的移动建站平台h2> 
6.         div> 
7.         <a class="start" href="http://www.aseoe.com/">开始建站a> 
8.     div> 
9.     <ul id="menu"> 
10.         <li class="active" data-menuanchor="page1"><a class="a1" href="#page1" title="快速创建移动站点">快速创建移动站点a>li> 
11.         <li data-menuanchor="page2"><a class="a2" href="#page2" title="丰富的模板">丰富的模板a>li> 
12.         <li data-menuanchor="page3"><a class="a3" href="#page3" title="强大的功能组件">强大的功能组件a>li> 
13.         <li data-menuanchor="page4"><a class="a4" href="#page4" title="多种屏幕预览">多种屏幕预览a>li> 
14.         <li data-menuanchor="page5"><a class="a5" href="#page5" title="全网高速访问">全网高速访问a>li> 
15.     ul> 
16. div> 
17. <div class="section"> 
18.   <div class="imgbox"><img src="images/1.jpg" alt="快速创建移动站点">div> 
19. div> 
20. <div class="section"> 
21.   <div class="imgbox"><img src="images/2.jpg" alt="丰富的模板">div> 
22. div> 
23. <div class="section"> 
24.   <div class="imgbox"><img src="images/3.jpg" alt="强大的功能组件">div> 
25. div> 
26. <div class="section"> 
27.   <div class="imgbox"><img src="images/4.jpg" alt="多种屏幕预览">div> 
28. div> 
29. <div class="section"> 
30.   <div class="imgbox"><img src="images/5.jpg" alt="全网高速访问">div> 
31. div>