햄버거메뉴 작동
본문
현재 반응형 모바일과 574px 미만의 스크린 사이즈에서 보이는 햄버거 메뉴를 만드는데 작동이 되지 않아 도움을 요청합니다..ㅜ
html
<div id="hd_wrapper">
<div id="logo2"></div>
<a href="#" class="hamburger"></a>
<div id="tnb2"></div>
</div>
css
#tnb {
left:-200%;
position: fixed;
}
#tnb:active {
left:0;
}
.hamburger {
display:block
}
JS
const hamburger = document.querySelector(".hamburger");
const navMenu = document.querySelector("#tnb2");
hamburger.addEventListener("click", mobileMenu);
function mobileMenu() {
hamburger.classList.toggle("active");
navMenu.classList.toggle("active");
}
간단하게 코드는 이런 식으로 짰습니다.
아래에 링크도 남깁니다. 꼭 도와주세요!!!!!
http://tndtnkr.com/shop/about.php#
답변 1
<script src="https://code.jquery.com/jquery-2.2.1.min.js">
const hamburger = document.querySelector(".hamburger");
const navMenu = document.querySelector("#tnb2");
hamburger.addEventListener("click", mobileMenu);
function mobileMenu() {
hamburger.classList.toggle("active");
navMenu.classList.toggle("active");
}
</script>
이렇게가 맞나요?? 변화가 없어서 재질문 드립니다...!
아뇨....
<script src="https://code.jquery.com/jquery-2.2.1.min.js"></script>
를
head.php넣어보세요......
헉... 해결됐어요!!!! 필립선생님 덕분에 하루 중 기분 제일 좋을 것 같아요. 너무 감사드립니다 :-)
채택부탁드려요 ㅎ
답변을 작성하시기 전에 로그인 해주세요.