개발/jquery,javascript

단순 탭 메뉴만들기 show(), hide()

lovelytney 2020. 8. 25. 13:23
반응형
var tabSubMenu = $("#manpTabList div");
tabSubMenu.hide();
tabSubMenu.eq(0).show();

$('.tabmenu').click(function() {
  var idx = $(".tabmenu").index($(this));
  tabSubMenu.hide();
  tabSubMenu.eq(idx).show();
});
tabSubMenu.eq(0).show();		

<div id="tabMenu">
  <ul class="tab">
    <li class='tabmenu' id="default"><a href="#">탭메뉴1</a></li>
    <li class='tabmenu'><a href="#">탭메뉴2</a></li>
    <li class='tabmenu'><a href="#">탭메뉴3</a></li>
  </ul>
</div>
<div id="manpTabList">	
  <div id="tab1"></div>
  <div id="tab2"></div>
  <div id="tab3"></div>
</div>

 

반응형