JS自定义选项卡函数及用法实例分析

本文实例讲述了JS自定义选项卡函数及用法。分享给大家供大家参考。具体如下：

这里分享一个JS选项卡函数附带演示效果，选项卡函数参数调用说明：

cmd：点击元素集合
con：显示容器集合
evt：触发事件
css：为当前点击元素的样式名称
index：为默认显示第几项的索引值
目前选项卡的样式还比较简洁和粗糙，想用的自己动动手美化一下。

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-zdy-tab-cha-fun-style-codes/

具体代码如下：

ul,li{ margin:0; padding:0; overflow:hidden; list-style:none; font-family:"Lucida Console", Monaco, monospace}
#tab{ width:300px; height:25px; border:1px solid #ddd}
#tab li{ width:75px; height:25px; line-height:26px; text-align:center; float:left; cursor:pointer}
#tab li.curr{ background:#eee}
#con{ width:300px; border:1px solid #ddd; margin-top:-1px;}
#con li{ display:none; width:280px; height:100px; padding:10px;}




 

  
1
  
2
  
3
  
4
 


 

  
a
  
b
  
c
  
d
 

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