jQuery Tab选项卡切换插件:jquery.lixtabs.js

这是我自己写的一个jquery插件,由功能相同的纯JS版LixTabs改造而来。这也是我的第一个jquery插件,嘿嘿。

所以,jquery.lixtabs.js的参数和原版LixTabs一模一样,不过多了一个参数:how,规定tab内容区出现的方式,值是jQuery自带的变化效果,如fadeIn,slideDown,show等等(其实全部的值就这三个);另外,去掉了原来的两个参数:hdtag与bdtag,即tab头部与内容区的html标签,因为我觉得对于强大的jQuery来说,这两个标签已经不必要了。

lixtabs插件使用效果预览

另,引用LixTabs原版的参数说明:

  1. hdcn:’tabhd’,//tab头的className
  2. hdtagcur:’cur’,//tab头中当前标签的className
  3. bdcn:’tabbd’,//tab内容区的className
  4. bdtagcur:’cur’,//tab内容区中当前标签的className
  5.  event:’mouseover’,//切换如何触发
  6. auto:null //是否自动切换,值为毫秒,默认没有;只要一传值,就会自动切换
  7. how:’fadeIn’ //tab切换时的效果

jquery版的lixtabs相对于纯JS版,代码体积由3.3KB缩减到2.2KB(并没有缩小一半啊,惭愧).

使用方式见示例页:lixtabs插件使用效果预览

如果你的网站并没有使用jquery,但也想实现选项卡切换效果,建议你使用LixTabs原版

5 评论

  1. LixTabs好用是好用,但是我觉得命名有点差,能不能改成那些参数一看就知道是什么意思的?例如hdcn我一看就不知道是干嘛的,hdtagcur,这个可能还可能会明白。
    我的建议是,nav是导航,content是内容,这样去分比hd好,还有how应该用effect代替或者其他来代替,很多外国的控件一看参数就知道是说什么的了!

发表评论

电子邮件地址不会被公开。