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 相关文章推荐
asp.net网站开发中用jquery实现滚动浏览器滚动条加载数据(类似于腾讯微博)
Mar 14 Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
Jul 09 Javascript
JavaScript的事件绑定(方便不支持js的时候)
Oct 01 Javascript
JavaScript截取字符串的Slice、Substring、Substr函数详解和比较
Mar 20 Javascript
jQuery Masonry瀑布流插件使用方法详解
Jan 18 Javascript
BootStrap Datepicker 插件修改为默认中文的实现方法
Feb 10 Javascript
js事件委托和事件代理案例分享
Jul 25 Javascript
angular 实现同步验证器跨字段验证的方法
Apr 11 Javascript
移动端吸顶fixbar的解决方案详解
Jul 17 Javascript
vue 使用 canvas 实现手写电子签名
Mar 06 Javascript
vue全局使用axios的操作
Sep 08 Javascript
js异步接口并发数量控制的方法示例
Nov 22 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
Erlang的运算符(比较运算符,数值运算符,移位运算符,逻辑运算符)
2012/07/23 PHP
php校验表单检测字段是否为空的方法
2015/03/20 PHP
浅析Yii2 gridview实现批量删除教程
2016/04/22 PHP
php制作基于xml的RSS订阅源功能示例
2017/02/08 PHP
jquery.artwl.thickbox.js  一个非常简单好用的jQuery弹出层插件
2012/03/01 Javascript
得到jQuery detach()后节点中的某个值实现代码
2013/02/05 Javascript
JS实现侧悬浮浮动实例代码
2013/11/29 Javascript
jquery easyui combobox模糊过滤(示例代码)
2013/11/30 Javascript
用html5 js实现点击一个按钮达到浏览器全屏效果
2014/05/28 Javascript
Jquery设置attr的disabled属性控制某行显示或者隐藏
2014/09/25 Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
2015/08/18 Javascript
使用 JavaScript 进行函数式编程 (一) 翻译
2015/10/02 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
2016/04/18 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
详解使用angularjs的ng-options时如何设置默认值(初始值)
2017/07/18 Javascript
基于node.js实现微信支付退款功能
2017/12/19 Javascript
微信小程序使用for循环动态渲染页面操作示例
2018/12/25 Javascript
javascript的delete运算符知识点总结
2019/11/19 Javascript
node.js中process进程的概念和child_process子进程模块的使用方法示例
2020/02/11 Javascript
Vue实现简易计算器
2020/02/25 Javascript
[02:30]辉夜杯主赛事第二日胜者组半决赛 CDEC.Y赛后采访
2015/12/26 DOTA
python自动化工具日志查询分析脚本代码实现
2013/11/26 Python
Python实现遍历windows所有窗口并输出窗口标题的方法
2015/03/13 Python
python使用xlrd与xlwt对excel的读写和格式设定
2017/01/21 Python
Python之pandas读写文件乱码的解决方法
2018/04/20 Python
python爬虫实例详解
2018/06/19 Python
tensorflow 环境变量设置方式
2020/02/06 Python
python 在threading中如何处理主进程和子线程的关系
2020/04/25 Python
俄罗斯在线水暖商店:Perfecto.ru
2019/10/25 全球购物
JS原生实现轮播图的几种方法
2021/03/23 Javascript
村委会贫困证明范文
2014/09/21 职场文书
党的群众路线教育实践活动党员个人整改措施
2014/10/27 职场文书
青年文明号申报材料
2014/12/23 职场文书
观后感格式
2015/06/19 职场文书
MySQL 隔离数据列和前缀索引的使用总结
2021/05/14 MySQL
html用代码制作虚线框怎么做? dw制作虚线圆圈的技巧
2022/12/24 HTML / CSS