jquery tab插件精简版分享


Posted in Javascript onSeptember 10, 2011
/* 
* jqpressToos1.0 
* 
* Copyright (c) 2011 yepeng 
* Dual licensed under the MIT (MIT-LICENSE.txt) 
* and GPL (GPL-LICENSE.txt) licenses. 
* 
*/ $.fn.extend({ 
//插件名称:Tab选项卡 
jqpressTab: function(options) { 
//参数和默认值 
var defaults = { 
_tabClass: null,//选项卡样式 
_childs:null //子选项 样式选择器 
}; 
var options = $.extend(defaults, options); 
var o = options; 
var parentCate = $(this); 
var childCate = $(o._childs); 
parentCate.mouseover(function() { 
parentCate.removeClass(o._tabClass); 
$(this).addClass(o._tabClass); 
for (i = 0; i < parentCate.length; i++) { 
if (parentCate[i].className == o._tabClass) { 
childCate[i].style.display = "block"; 
} else { 
childCate[i].style.display = "none"; 
} 
} 
}); 
} 
}); 
})(jQuery);

调用方法更简单:

jQuery(document).ready(function(){ $(".mytab li a").jqpressTab({ _tabClass: "样式名称", _childs: "子元素样式名称" });});

如果需要根据ID做选择器自己扩展去吧,呵呵

Javascript 相关文章推荐
基于node.js的快速开发透明代理
Dec 25 Javascript
线路分流自动智能跳转代码,自动选择最快镜像网站(js)
Oct 31 Javascript
通过正则表达式实现表单验证是否为中文
Feb 18 Javascript
下拉框select的绑定示例
Sep 04 Javascript
Angular ui.bootstrap.pagination分页
Jan 20 Javascript
使用Vue写一个datepicker的示例
Jan 27 Javascript
vue中echarts3.0自适应的方法
Feb 26 Javascript
学习使用ExpressJS 4.0中的新Router的用法
Nov 06 Javascript
vue-cli 打包后提交到线上出现 &quot;Uncaught SyntaxError:Unexpected token&quot; 报错
Nov 06 Javascript
微信小程序实现多选删除列表数据功能示例
Jan 15 Javascript
ElementUI之Message功能拓展详解
Oct 18 Javascript
JavaScript 类的封装操作示例详解
May 16 Javascript
javascript语言结构小记(一)
Sep 10 #Javascript
JavaScript高级程序设计 客户端存储学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 错误处理与调试学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 事件学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 XML、Ajax 学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 DOM学习笔记
Sep 10 #Javascript
jquery maxlength使用说明
Sep 09 #Javascript
You might like
PHP中file_exists函数不支持中文名的解决方法
2014/07/26 PHP
如何让thinkphp在模型中自动完成session赋值小教程
2014/09/05 PHP
php查看网页源代码的方法
2015/03/13 PHP
PHP对象链式操作实现原理分析
2016/10/09 PHP
Zend Framework前端控制器用法示例
2016/12/11 PHP
javascript 关闭IE6、IE7
2009/06/01 Javascript
js模拟select下拉菜单控件的代码
2013/05/08 Javascript
在表单提交前进行验证的几种方式整理
2013/07/31 Javascript
简单的两种Extjs formpanel加载数据的方式
2013/11/09 Javascript
Javascript中3种实现继承的方法和代码实例
2014/08/12 Javascript
浅析JavaScriptSerializer类的序列化与反序列化
2016/11/22 Javascript
JS函数多个参数默认值指定方法分析
2016/11/28 Javascript
ThinkPHP+jquery实现“加载更多”功能代码
2017/03/11 Javascript
在vue项目中使用sass的配置方法
2018/03/20 Javascript
对 Vue-Router 进行单元测试的方法
2018/11/05 Javascript
详解关于JSON.parse()和JSON.stringify()的性能小测试
2019/03/14 Javascript
javascript实现手动点赞效果
2019/04/09 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
2019/04/30 Javascript
js中let能否完全替代IIFE
2019/06/15 Javascript
Vue触发隐藏input file的方法实例详解
2019/08/14 Javascript
Python实现图片转字符画的示例
2017/08/22 Python
基于Python数据可视化利器Matplotlib,绘图入门篇,Pyplot详解
2017/10/13 Python
对python多线程SSH登录并发脚本详解
2019/02/14 Python
搞定这套Python爬虫面试题(面试会so easy)
2019/04/03 Python
更新升级python和pip版本后不生效的问题解决
2020/04/17 Python
基于python实现查询ip地址来源
2020/06/02 Python
Python使用pyexecjs代码案例解析
2020/07/13 Python
露营世界:Camping World
2017/02/02 全球购物
Asics日本官网:鬼冢八喜郎创立的跑鞋运动品牌
2017/10/18 全球购物
在线实验室测试:HealthLabs.com
2020/05/03 全球购物
VC++笔试题
2014/10/13 面试题
一道写SQL的面试题和答案
2013/11/19 面试题
法务专员岗位职责
2014/01/02 职场文书
幼儿园保教管理制度
2014/02/03 职场文书
销售人员求职的自我评价分享
2014/03/15 职场文书
硕士毕业论文导师评语
2014/12/31 职场文书