吉光片羽 / 钱端攻城狮 / 正文

JQuery Tab选项卡插件KandyTabs发布与更新

by 吉光片羽 on 6 年前(2011-01-27)

插件简介

制作这个插件的初衷完全是为了方便自己在网站中的应用,如果用现有的TAB选项卡插件,加上幻灯片什么的特效,光是插件文件就得导入好几个,额外的就增加了HTTP请求和流量。一开始制作KandyTabs也只是为了满足Tab功能,后来发现幻灯片的原理其实也差不多,于是就加上了Slide功能,另外,According类型的插件貌似也挺流行实用的,索性就一起整合,加上了Fold功能,于是乎,在不断满足自己的各种需求下,功能也越来越齐全了。但是,KandyTabs的特点并不仅仅只是这些丰富的应用功能,而是他最内在的精髓——受到用户体验优化思想极大影响的优点——代码结构。关于这点的详细解说,可以到插件的演示页面一探究竟。事实上,如果按照“所见即所得”的代码结构来写Tab选项卡,插件体积应该可以更小,效率更高的。但如果你认同KandyTabs的灵魂,那就请毫不犹豫的好好享用吧。

插件特色

  • KandyTabs 是一个基于标准Tab模式的JQuery Tab选项卡插件。

  • KandyTabs 是一个符合HTML标准且绝对有利于SEO的JQuery Tab选项卡插件。

  • KandyTabs 是一个特别方便CMS类程序模板编写的选项卡插件,只需必要内容即可实现复杂的外观效果。

  • KandyTabs 是一个集合选项卡、幻灯片,折叠特效于一体的JQuery Tab选项卡插件。只需一个KandyTabs,你就可以轻松在网页中同时实现各种风格形式的Tab、Slide、fold应用。

  • 支持选项的增删。

  • 支持超多选项的卷轴切换。

  • 支持无限嵌套。

  • 支持在运行开始和结束时回调函数。

  • 支持切换过程中自定义特效。

  • 支持API接口外部控制。

插件配置

在需要使用KandyTabs插件的页面源码中的之间,按顺序插入如下代码:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="kandytabs.js"></script>

你可以在这两行之后,或者是之内使用如下代码让KandyTabs发威:

<script type="text/javascript">
  $(function(){
    $("dl").KandyTabs();
  })
</script>

更高级的应用请查看演示页面的 配置说明

更新日志

KanyTabs正在不断的完善和更新,从1.0到现在的4.0经历了3年时间,在此仅列出最新版本更新时间和内容,更详细的插件成长里程碑请移步插件演示页面一探究竟。

  • 2014年1月12日 V4.2.0112
    BUG;修正done和custom回调运行逻辑不准确的问题。

演示下载

http://demo.jgpy.cn/kandytabs/

« 6个出色的基于JQuery的Tab选项卡实例

因为便携,所以佳能100D,想要入手传说中最小单反! »

表个态度 Comment

名称

邮箱

网址

访客 访客 去年(2015-12-22) | 回复 【热评】你的那个图片幻灯片,怎么才能支持移动终端的触摸滑动呢?10
访客 访客 2 年前(2015-10-22) | 回复 http://demo.jgpy.cn/kandytabs/ 这个网页能不能不引用google api啊每次打开都非常慢。https://apis.google.com/js/plusone.js 就这个把!00
吉光片羽 吉光片羽 2 年前(2015-11-10) | 回复 已经嫌弃谷歌+1,请体验飞一般的感觉!00
吉光片羽 吉光片羽 2 年前(2015-11-08) | 回复 抱歉,有时间上新版本就不要谷歌+1这被墙的玩意了……00
阳诡子 阳诡子 3 年前(2014-10-30) | 回复 你说你搞那么多干嘛?像http://www.corange.cn/demo/3801/index.html这样简洁明了行不行?00
阳诡子 阳诡子 3 年前(2014-10-30) | 回复 看着流口水,可是我看演示页面弄了一宿硬是一个效果也弄不出来,看说明也看得超晕的!你能不能单独把每个效果的JS、CSS、HTML都分离出来?00
吉光片羽 吉光片羽 2 年前(2015-11-08) | 回复 抱歉,实在木有时间捣鼓示例详情……00
访客 访客 3 年前(2014-09-29) | 回复 有个小问题,就是鼠标放在选项卡标签上时指针形状如果变成手就好了。00
吉光片羽 吉光片羽 2 年前(2015-11-10) | 回复 感谢您的建议。如果是点击开合的选项卡就是手型的,如果是悬停的就不是手型了,不然会误导用户点击,而点击是没有实际意义的。00
最赞文章 bestPosts
最新留言 comments
友情链接 blogroll