位置: 编程技术 - 正文
JavaScript插件Tab选项卡效果(js插件大全)
编辑：rootadmin推荐整理分享JavaScript插件Tab选项卡效果(js插件大全)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:JavaScript插件编辑视频,JavaScript插件库,JavaScript插件库,JavaScript插件库,JavaScript插件开发教程,JavaScript插件下载,JavaScript插件编辑视频,JavaScript插件库,内容如对您有帮助，希望把文章链接给更多的朋友！
闲来无事，研究了一下JavaScript插件的写法，今天就将自己写的一个小插件记录下来。
本文介绍了此款插件的基本用法，实现的功能以及代码。
首先，来看看最终效果：
这是一款普通的Tab选项卡插件，下面来讲讲它实现了哪些功能：
1、支持不同鼠标事件触发选项卡切换效果； 2、支持不同切换效果的配置，例如淡入淡出/直接切换； 3、支持默认展示第几个选项卡的配置； 4、支持选项卡的自动切换效果。
例子很简单，需要用到的知识包括： 1、html、css的基础知识； 2、对this，prototype，new等关键词的理解。
简而言之，就是通过参数配置的形式来完成不同效果的展示。
下面先看一看如何使用：
1、$(".js-tab").etab();2、$(".js-tab").etab({ triggerType: "click", effect: "fade", invoke: 2, auto: });3、Tab.init($(".js-tab"));
本插件支持几种不同的初始化方式，代码很简单，类似于BootStrap插件的使用方法。下面奉上完整的代码：
index.html
最后将插件代码列出来，在代码里面已经写了很详细的注释：
如此看来，是不是很简单，一起来动手试试吧！
标签: js插件大全
本文链接地址:https://www.jiuchutong.com/biancheng/369786.html 转载请保留说明！上一篇：JS 仿支付宝input文本输入框放大组件的实例(nodejs支付宝支付)
