모바일 gnb 오픈 버튼을 터치하면 onclick 이벤트가 실행되자마자 사라집니다.
본문
(모바일로 접속해주세요!)
우측 상단의 햄버거 버튼을 터치하면 사이트 메뉴가 노출되어야 하는데, 잠깐 깜빡거렸다 바로 다시 사라집니다.
이쪽 스크립트는 아예 건드리질 않아서 이유를 모르겠습니다ㅠㅠㅠ;
사이트 menu.php를 첨부합니다. 아래 링크 클릭하시면 바로 다운로드됩니다.
언제나 도와주셔서 감사합니다... ㅠㅠㅠ
답변 3
햄버거버튼을 a 태그가 감싸고 있어서 그렇습니다.
<a href=" ... /main.php">
...
<button type="button" onclick="control_mobile_menu();" class="control-mobile-menu txt-default">
<span class="material-icons open">menu</span>
<span class="material-icons close">close</span>
</button>
...
</a>
간단하게는 다음처럼 확인해볼수 있습니다.
<a href=" ... /main.php#">
open-gnb 클래스 채크해보세요.
같은 소스코드 사용하는 타 사이트에서는 문제없이 작동해서요. open-gnb 클래스명이 포함된 스타일시트 부분을 첨부합니다. ㅠㅠ;
@media all and (max-width:1024px) {
.control-mobile-menu {display:none; position:fixed; top:0; right:0; width:50px; height:50px; font-size:30px; z-index:991;}
.single .control-mobile-menu {display:block;}
body:not(.open-gnb) .control-mobile-menu .close {display:none;}
body.open-gnb .control-mobile-menu .open {display:none;}
#header {display:none !important;}
#mo_header {position:fixed; top:0; left:0; right:0; bottom:0; z-index:990; overflow:auto; opacity:0; visibility:hidden; backdrop-filter: blur(2px); transform:translateY(10%); -webkit-transform:translateY(10%);}
#mo_header > div {display:table; width:100%; height:100%;}
#mo_header > div > div {display:table-cell; vertical-align:middle; text-align:center; padding:30px;}
body.open-gnb #mo_header {opacity:1; visibility:visible; transform:translateY(0); -webkit-transform:translateY(0);}버튼이 a영역 안에 들어가 있네요?? a링크가 작동을 하는 듯 보입니다.
a 링크가 잡혀있어서 링크 이동 하면서 리로드 되는듯 보입니다.
a에 링크를 빼거나 링크 제거가 어려운 경우 클릭시 링크 작동하지 않도록
click 펑션에 return false; 넣어보세요~
제가 바보같이... head.php에 삽입한 a태그 중 하나를 안 닫았더라고요...ㅠㅠㅠㅠㅠㅠㅠ 답변주신 분들 정말 감사합니다ㅠㅠㅠㅠㅠㅠ
답변을 작성하시기 전에 로그인 해주세요.
