그누보드 5.3 모바일 홈페이지 메뉴 Jquery 문의
본문
<ul id="gnb_1dul">
<li class="gnb_1dli">
<a href="#" target="_self" class="gnb_1da">메뉴 1</a>
<button type="button" class="btn_gnb_op">하위분류</button><ul class="gnb_2dul" style="overflow: hidden; display: none;">
<li class="gnb_2dli"><a href="/bbs/content.php?co_id=intro001" target="_self" class="gnb_2da"><span></span>컨텐츠 1</a></li>
<li class="gnb_2dli"><a href="/bbs/board.php?bo_table=board" target="_self" class="gnb_2da"><span></span>게시판 1</a></li>
</ul>
</li>
<li class="gnb_1dli">
<a href="#" target="_self" class="gnb_1da">메뉴 2</a>
<button type="button" class="btn_gnb_op">하위분류</button><ul class="gnb_2dul">
<li class="gnb_2dli"><a href="/bbs/content.php?co_id=intro001" target="_self" class="gnb_2da"><span></span>컨텐츠 2</a></li>
<li class="gnb_2dli"><a href="/bbs/board.php?bo_table=board2" target="_self" class="gnb_2da"><span></span>게시판 2</a></li>
</ul>
</li>
<li class="gnb_1dli">
<a href="#" target="_self" class="gnb_1da">메뉴 3</a>
<button type="button" class="btn_gnb_op">하위분류</button><ul class="gnb_2dul">
<li class="gnb_2dli"><a href="/bbs/content.php?co_id=intro001" target="_self" class="gnb_2da"><span></span>컨텐츠 3</a></li>
<li class="gnb_2dli"><a href="/bbs/board.php?bo_table=board3" target="_self" class="gnb_2da"><span></span>게시판 3</a></li>
</ul>
</li>
<li class="gnb_1dli">
<a href="#" target="_self" class="gnb_1da">메뉴 4</a>
<button type="button" class="btn_gnb_op">하위분류</button><ul class="gnb_2dul">
<li class="gnb_2dli"><a href="/bbs/content.php?co_id=intro001" target="_self" class="gnb_2da"><span></span>컨텐츠 4</a></li>
<li class="gnb_2dli"><a href="/bbs/board.php?bo_table=board4" target="_self" class="gnb_2da"><span></span>게시판 4</a></li>
</ul>
</li>
<li class="gnb_1dli">
<a href="#" target="_self" class="gnb_1da">메뉴 5</a>
<button type="button" class="btn_gnb_op">하위분류</button><ul class="gnb_2dul">
<li class="gnb_2dli"><a href="/bbs/content.php?co_id=intro001" target="_self" class="gnb_2da"><span></span>컨텐츠 5</a></li>
<li class="gnb_2dli"><a href="/bbs/board.php?bo_table=board5" target="_self" class="gnb_2da"><span></span>갤러리 5</a></li>
</ul>
</li>
</ul>
<script>
$(function() {
$(".hd_opener").on("click", function() {
var $this = $(this);
var $hd_layer = $this.next(".hd_div");
if ($hd_layer.is(":visible")) {
$hd_layer.hide();
$this.find("span").text("열기");
} else {
var $hd_layer2 = $(".hd_div:visible");
$hd_layer2.prev(".hd_opener").find("span").text("열기");
$hd_layer2.hide();
$hd_layer.show();
$this.find("span").text("닫기");
}
});
$("#container").on("click", function() {
$(".hd_div").hide();
});
$(".btn_gnb_op").click(function() {
$(this).toggleClass("btn_gnb_cl").next(".gnb_2dul").slideToggle(300);
});
$(".hd_closer").on("click", function() {
var idx = $(".hd_closer").index($(this));
$(".hd_div:visible").hide();
$(".hd_opener:eq(" + idx + ")").find("span").text("열기");
});
});
</script>
이부분인데 gnb_1dli > a 만 클릭해도 btn_gnb_op 이 토글되면서 gnb_2dul 뜨게 할 수 있나요?
답변 1
$(function() {
});
안에 다음의 코드를 추가하면 되지 않을까 합니다.
$('.gnb_1dli a').on('click', function() {
$(this).parent().find('.btn_gnb_op').trigger('click');
});
답변을 작성하시기 전에 로그인 해주세요.