jQuery插件之--选择卡切换效果

写了一款jQuery插件，选择卡切换效果：

    /* 

        <div class="tab-container"> 

        <ul class="tab-title"> 

            <li class="current"></li> 

            <li></li> 

            <li></li> 

            <li></li> 

        </ul> 

        <div class="tab-content"></div> 

        <div class="tab-content"></div> 

        <div class="tab-content"></div> 

        <div class="tab-content"></div> 

        </div> 

    */  

      

    (function($){  

      

        $.fn.tab = function(options){  

            var ops = $.fn.extend({  

                //当前样式  

                currentClass : "current"  

              

            },options);  

            return this.each(function(){  

                  

                var $this = $(this);  

                var $li = $this.find("ul > li");  

                var $index = $this.index();  

                  

                $li.click(function(){  

                    var _$this = $(this);  

                    var n =_$this.index();  

                    //移除样式  

                    $li.removeClass(ops.currentClass);  

                    //添加当前样式  

                    _$this.addClass(ops.currentClass);  

                    //隐藏所有  

                    $this.find(".tab-content").hide();    

                    //显示当前  

                    $this.find(".tab-content:eq("+n+")").show();      

                });  

      

            });  

          

        }  

      

      

    })(jQuery);  

 

    .tab-container {}  

    .tab-container .current{}  

    .tab-container .tab-content{display:none}