아코디언 좌측메뉴! 채택완료
지네12
8년 전
조회 10,343
아코디언 형식으로 좌측메뉴를 만들고 있습니다!
문제는 해당 페이지에 들어갔을때, 해당 아코디언이 열려있어야하는데ㅠ_ㅠ
어떤식으로 짜야할지 감이 않와서요,,
<div class="side_menu">
if($subnum=="1") { ?> <li><a href="/sub1.php" class="인사말") echo "on"; ?>">인사말a>li> <li><a href="/sub2.php" class="sub2") echo "on"; ?>">sub2a>li> <li><a href="#none" class="공지사항") echo "on"; ?>">공지사항a> <ul class="side_sub"> <li><a href="/bbs/board.php?bo_table=board1">공지사항a>li> <li><a href="/bbs/board.php?bo_table=board2">다시보기a>li> ul> li> <li><a href="/bbs/board.php?bo_table=board3" class="뉴스") echo "on"; ?>">뉴스a>div><script> $(function() { $(".side_sub").hide().first().show() $(".side_menu>ul>li>a").click(function(e){ $(this).next().slideToggle() $(".side_sub li a").not(this).next().slideUp() $(".side_menu>ul>li").removeClass("on") $(this).parent().addClass("on")})})script>
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
8년 전
일단 위에적어준 코드가 깨져있습니다.
- 태그가 안닫혀있고, php 구문 else if문에 괄호가 안닫혀있습니다.
html, php 구문을 제대로 입력해놓으시면 아래의 script로 현재 on 돼어있는 클래스를 판별해서
아래의 스크립트로 현재 메뉴의 하위메뉴를 펼쳐지게 할 수 있습니다.
</p><p><script></p><p>$(function() {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>//$(".side_sub").hide().first().show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(".side_menu>ul>li>a").click(function(e){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).next().slideToggle();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(".side_sub li a").not(this).next().slideUp();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(".side_menu>ul>li").removeClass("on");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).parent().addClass("on");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>return false;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(".side_menu>ul>li").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).find("a.on").next().show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p>});</p><p></script> </p><p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인