jq 봉인 옵션 카드 작성

1697 단어 봉인하다
jq 일반 탭 쓰기:
  var tabTag=$('#tabon');

  var tabon=tabTag.find('li');// 

  var tabCon=$(".hidden");// 

   tabon.each(function(i){

	   $(this).hover(function(){

	    tabon.removeClass("cur");

	    $(this).addClass("cur");// 

	    tabCon.eq(i).show().siblings().hide();// 

	 })				   

  })


 
jq 패키지 탭 쓰기:
 
function Tab(option){

    this.root=$(option.root);

    this.tabTag=this.root.find('#tabon li');// 

    this.hidden=this.root.find('.hidden');// 

    this.init();

}

Tab.prototype={

    init:function(){

        var that=this;

        this.tabTag.each(function(i){

            $(this).hover(function(){

                that.tabTag.removeClass('cur');

                $(this).addClass('cur');

                that.hidden.eq(i).show().siblings().hide();             

            })

        })

    }

}

$(function(){

 new Tab({'root':$('#tab')}) ;

})


 
htm 구조:
 
<div class="tab tab_ship" id="tab">

		 <div class="tabon" id="tabon">

			 <ol>

				 <li class="cur"><a href="#"> </a></li>

				 <li><a href="#"> </a></li>

			 </ol>

		  </div><!--/tabon-->

		  <div class="tabcon">

			 <div class="hidden"  style="display:block;"></div>

			 <div class="hidden" > </div>

			 

		  </div><!--/tabcon-->					

  </div>


 
 
 
 

좋은 웹페이지 즐겨찾기