jQuery+css实现百度百科的页面导航效果

这周不小心看到了百度百科的页面导航效果,感觉挺不错的,周末抽空写了下。

下图为导航部分的效果图:

jQuery+css实现百度百科的页面导航效果_第1张图片

css和图片都是抄百度的,可从百度百科下载。

具体的代码如下:

复制代码 代码如下:




   
   
   
   




   


       
        1
        part1
   

   


        content1,content1
       

























   

   


       
        2
        part2
   

   


        content2,content2
       

























   

   


       
        2-1
        part2-1
   

   


        content2-1,content2-1
       

























   

   


       
        2-2
        part2-2
   

   


        content2-2,content2-2
       

























   

   


       
        3
        part3
   

   


        content,content
       

























   

   


       
        4
        part4
   

   


        content,content
       

























   

   


       
        5
        part5
   

   


        content5,content5
       

























   

   


       
        6
        part6
   

   


        content6,content6
       

























   

   


       
        7
        part7
   

   


        content7,content7
       

























   

   


       
        8
        part8
   

   


        content8,content8
       

























   

   


       
        9
        part9
   

   


        content9,content9
       

























   

   


       
        10
        part10
   

   


        content10,content10
       

























   

   


       
        11
        part11
   

   


        content11,content11
       

























   

   


       
        12
        part12
   

   


        content12,content12
       

























   

   


       
        13
        part13
   

   


        content13,content13
       

























   

   


       
        14
        part14
   

   


        content14,content14
       

























   

   


       
        15
        part15
   

   


        content15,content15
       

























       

























        bottom
   



   

       

           

               

               

           

           

               

               

           

           

               

                   

                        1
                        part1
                       
                   

                   

                        2
                        part2
                       
                   

                   

                        2-1
                        part2-1
                       
                   

                   

                        2-2
                        part2-2
                       
                   

                   

                        3
                        part3
                       
                   

                   

                        4
                        part4
                       
                   

                   

                        5
                        part5
                       
                   

                   

                        6
                        part6
                       
                   

                   

                        7
                        part7
                       
                   

                   

                        8
                        part8
                       
                   

                   

                        9
                        part9
                       
                   

                   

                        10
                        part10
                       
                   

                   

                        11
                        part11
                       
                   

                   

                        12
                        part12
                       
                   

                   

                        13
                        part13
                       
                   

                   

                        14
                        part14
                       
                   

                   

                        15
                        part15
                       
                   

               

           

       

       
       
   







大站就是有大站的风范,很多效果还都是他们先开始制作使用,小伙伴们可以经常去逛逛,很容易发现些好东西

你可能感兴趣的:(jQuery+css实现百度百科的页面导航效果)