ㅠㅠ 메인에서는 토글을 눌렀을때 열기만 되고 닫히지는 않습니다.
그러나 서브에서는 열기 닫기 모두 정상으로 작동합니다. 무엇이 문제일까요?
html 구조는 이렇습니다
Copy
<div id="btn_side"> <button type="button" id="side_mn_btn"><a href="#"><span class="sound_only"> 메뉴 열기</span></a></button> </div> <div id="side_menu"> <div class="side_close"><button type="button">닫기</button></div> <div class="side_wr add_side_wr"> <aside id="isroll_wrap" class="side_inner_rel"> <div class="side_inner_abs"> <nav class="side_menu"> <ul> <?php $sql = " select * from {$g5['menu_table']} where me_mobile_use = '1' and length(me_code) = '2' order by me_order, me_id "; $result = sql_query($sql, false); for ($i=0; $row=sql_fetch_array($result); $i++) { ?> <li class="mu_title"> <?php $submenus = ''; $sql2 = " select * from {$g5['menu_table']} where me_mobile_use = '1' and length(me_code) = '4' and substring(me_code, 1, 2) = '{$row['me_code']}' order by me_order, me_id "; $result2 = sql_query($sql2); for ($k=0; $row2=sql_fetch_array($result2); $k++) { if($k == 0) { $submenus .= '<button type="button" class="sub_toggle">하위메뉴</button>'.PHP_EOL; $submenus .= '<ul class="sub_menu">'.PHP_EOL; } $submenus .= '<li><a href="'.$row2['me_link'].'" target="_'.$row2['me_target'].'" class="gnb_2da">'.$row2['me_name'].'</a></li>'.PHP_EOL; } if($k > 0) $submenus .= '</ul>'.PHP_EOL; if($submenus) $gnb_class = 'sd_cl'; else $gnb_class = 'sd_cl'; ?> <a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="<?php echo $gnb_class; ?>"><?php echo $row['me_name'] ?></a> <?php echo $submenus; ?> </li> <?php } if ($i == 0) { ?> <li id="side_menu_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하세요.<?php } ?></li> <?php } ?> </ul> </nav> </div> </aside> </div> </div> </div>
그리고 쿼리는 이렇습니다
Copy
//사이드 메뉴var $btn_side = $("#btn_side"), $side_menu = $("#side_menu"), $side_wr = $("#side_menu .side_wr"), side_obj = { my : {} }, is_trans_sup = ''; $side_wr.css({"right":"-280px"}); //초기화 side_obj.destory = function(){ if( !is_trans_sup ) return; side_obj.my.destroy();}side_obj.refresh = function(){ if( !is_trans_sup ) return; side_obj.my.refresh();} function iscroll_loaded() { if( is_trans_sup ){ $side_wr.removeClass("add_side_wr"); side_obj.my = new IScroll('#isroll_wrap', { bounceTime : 400, mouseWheel: true, click: true, hScroll:false }); }} $btn_side.on("click", function() { if (!$(this).data('toggle_enable')) { $(this).data('toggle_enable', true); $side_menu.show(); $side_wr.animate({"right": "0px"}, 200, function(){ iscroll_loaded(); height_update($(this)); }); } else { remove_side_data(); }}); $(document).on("click", ".side_close", function(e){ if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){ remove_side_data(); }}) function height_update(target){ var side_wr_height = target.height(); $("body").css({"min-height":side_wr_height+"px"}).addClass("over_hidden");} function remove_side_data(){ $btn_side.data('toggle_enable', false); $side_wr.animate({"right": "-280px"}, 160, function(){ $side_menu.hide(); $("body").removeClass("over_hidden").css({"min-height":""}); });} $("#side_menu .side_wr").on("clickoutside", function(e){ //if ( !$(e.target).is('#btn_side *, #btn_side') ){ if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){ remove_side_data(); }}); // 서브메뉴 열기$(function (){ $(".sub_toggle").on("click", function() { var $this = $(this); $sub_ul = $(this).closest("li").children("ul.sub_menu"); if($sub_ul.size() > 0) { var txt = $this.text(); if($sub_ul.is(":visible")) { txt = txt.replace(/닫기$/, "열기"); $this .removeClass("sd_cl") .text(txt); } else { txt = txt.replace(/열기$/, "닫기"); $this .addClass("sd_cl") .text(txt); } $sub_ul.toggle(); } });});</script>
답변 1개 / 댓글 5개
채택된 답변
+20 포인트
이런 질문은 실제 사이트를 보여 주시는 것이 좋습니다.
개발자 도구나 요소 검사 등에서 에러가 나는지 확인해 볼 수 있습니다.
답변에 대한 댓글 5개
사이드메뉴 스크립트 중에
$(document).on("click", ".side_close", function(e){
if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){
remove_side_data();
}
})
여기서, 조건에 해당하는 두 값을 한번 찍어 보세요.
즉, remove_side_data() 를 타는지 확인해 보세요.
$(document).on("click", ".side_close", function(e){
if ( !$(e.target).closest("#btn_side").length && $btn_side.data('toggle_enable') ){
remove_side_data();
}
})
여기서, 조건에 해당하는 두 값을 한번 찍어 보세요.
즉, remove_side_data() 를 타는지 확인해 보세요.
답변을 작성하려면 로그인이 필요합니다.