jQuery/jQuery 기본
gnb메뉴 on click 이벤트 중복방지
hyojinny
2022. 11. 10. 12:38
$('#header .gnb>li>a').on('click', function () {
$(this).parent().toggleClass('on').siblings().removeClass('on');
// depth02가 안보이면 열기
if (!$(this).next().is(':visible')) {
$(this).next().slideDown(2000).parent().siblings().find('.depth02').slideUp();
} else {
$(this).next().slideUp(2000);
}
});
1 .gnb>li>a 에 온클릭 이벤트를 걸어서
이벤트를 건 자신 (this)의 부모 (li)에 토글이벤트를 켜라.
그리고 형제들은 on 이벤트를 껴라
2. 만약 (this : gnb>li>a)의 next 다음 is :visible (요소가 보이는지) ! 아니면
:visible 보인다.
(안보일때 false 일때 )
보이지 않을때
this 에 다음요소 (ul depth02) 슬라이드를 열고 (this : gnb>li>a) 부모의 형제에서 depth02를 찾아서
닫아라
만약 보이면
this를 다음으로 슬라이드를 닫아라