基于jQuery实现标签页切换的小功能

写在前面：

作为一个初入前端行业的小白，只是想将平时练习做的一些实用小功能分享出来，可能代码有时不是特别简洁，但代表了我自己的一些逻辑和思路。

功能介绍：

开发网页时经常会用到标签页切换的功能，点击链接时切换页面，如简图：

                                                  

                                                   

布局思路：

             1、顶部横排四个链接按钮通过ul>li*4实现，设置css样式为float：left（要注意解决ul的高度塌陷问题）；

             2、内容区为四个div构成，通过定位使其重叠。

布局代码：

                                    

CSS样式代码：

                                   

                                   

 （CSS样式设置就不多说了，可能有些地方设置的不是那么完美，请见谅~）       

JS代码：             

            

（啊。。。注释是当时写代码的时候怕朋友看不懂，所以加上去的，纯属自己的理解与思路，如果理解有偏差，请指教~）

第一次记录博客，小紧张。