jq 选项卡切换封装_Jquery封装tab自动切换效果的具体实现

今天我这边网速真是太慢了，打开一个网页要等待很久，但是还是想写篇文章----tab自动切换 因为工作中经常会碰到这样的问题 所以写博客也是总结下 最重要的是能分享下 及以后碰到类似的可以参考下！ 当然这是我用Jquery来封装的 页面可以调用多次 调用方式                new tabSlider(obj,count); obj指容器最外层ID,count指有多个li 当然要引用我这个js的话 一定要按照我结构来写！下面的是我的HTML一些结构如下：

• tab1
• tab2
• tab3
• tab4

tab1

tab2

tab3

tab4

结构是这样的！下面是我页面上的HTML/CSS的代码！

无标题文档

#tab1{ width:196px; height:220px; overflow:hidden; border:1px solid #666;}

#tab2{ width:196px; height:220px; overflow:hidden; border:1px solid #666;}

.menu{ width:196px; height:18px; margin:0; padding:0;}

.menu li{ float:left; list-style:none; width:48px; text-align:center; border-bottom:1px solid #666; border-right:1px solid #666; cursor:pointer;}

.menu li.current{ border-bottom:none;}

.content-main{ width:196px; height:200px; overflow:hidden;}

.content{ width:196px; height:200px; overflow:hidden; display:block;}

.hide{ display:none;width:196px; height:200px; overflow:hidden;}

.menu li.last-col{ border-right:none; width:49px;}

• tab1
• tab2
• tab3
• tab4

tab1

tab2

tab3

tab4

• tab1
• tab2
• tab3
• tab4

tab1

tab2

tab3

tab4