제이쿼리 드롭다운메뉴 질문
본문
var menu_sta;
$("header nav .gnb_pc>ul>li").on("click", function(){
menu_sta = $(this).hasClass("on");
if(menu_sta == true){//메뉴가 열려있다면
$(this).removeClass("on");
}else{//메뉴가 닫혀있다면
$("header nav .gnb_pc>ul>li").removeClass("on");
$(this).addClass("on");
}
});
1차메뉴를 클릭하면 2차메뉴가 슬라이드로 나오고
다른메뉴를 클릭하면 열려있던게 닫히고 클릭한게 열려야하는데
지금 on클래스는 잘 번갈아가면서 들어가는데
보여지고 슬라이드 하는걸 어디다가 넣어야하는지 모르겠네요 ㅠㅠ
답변 1
소스가 없으셔서 일반적으로
header nav .gnb_pc>ul>li 하위에 보여주실것이 ul 이시라면
css 에
header nav .gnb_pc>ul>li ul{display:none;}
header nav .gnb_pc>ul>li.on ul{display:block;}
하시면 되시고요 display 대신 visibility: hidden,show 로 하셔도 되고요
에니메이션을 주시려면
header nav .gnb_pc>ul>li.on ul{display:block;
-webkit-transition: height 1s; /* Safari */
transition: height 1s;
}
으로 transition 을 주시면 됩니다
답변을 작성하시기 전에 로그인 해주세요.