jquery tab插件精简版

so_brave

jquery tab插件精简版

自己平时用得比较多tab功能，网上有很强大的tab功能，但是很多时候太过于复杂，所以自己写了一个最简单的jquery插件，代码如下，就不解释了。

1. 
   
2. /* * jqpressToos1.0
   
3. * * Copyright (c) 2011 yepeng  
   
4. * Dual licensed under the MIT (MIT-LICENSE.txt)
   
5. * and GPL (GPL-LICENSE.txt) licenses.
   
6. * */$.fn.extend({//插件名称：Tab选项卡
   
7.     jqpressTab: function(options) {
   
8.         //参数和默认值
   
9.         var defaults = {
   
10.             _tabClass: null,//选项卡样式
    
11.             _childs:null //子选项 样式选择器
    
12.         };
    
13.         var options = $.extend(defaults, options);
    
14.         var o = options;
    
15.         var parentCate = $(this);
    
16.         var childCate = $(o._childs);
    
17.         parentCate.mouseover(function() {
    
18.         parentCate.removeClass(o._tabClass);
    
19.         $(this).addClass(o._tabClass);
    
20.             for (i = 0; i < parentCate.length; i++) {
    
21.                 if (parentCate[i].className == o._tabClass) {
    
22.                     childCate[i].style.display = "block";
    
23.                 } else {
    
24.                     childCate[i].style.display = "none";
    
25.                }            }        });    } });})
    
26. (jQuery);

复制代码

调用方法更简单：

jQuery(document).ready(function(){   $(".mytab  li  a").jqpressTab({ _tabClass: "样式名称", _childs: "子元素样式名称" });});　　如果需要根据ID做选择器自己扩展去吧，呵呵