아코디언 좌측메뉴!
본문
아코디언 형식으로 좌측메뉴를 만들고 있습니다!
문제는 해당 페이지에 들어갔을때, 해당 아코디언이 열려있어야하는데ㅠ_ㅠ
어떤식으로 짜야할지 감이 않와서요,,
<div class="side_menu">
<? if($subnum=="1") { ?> <li><a href="/sub1.php" class="<? if($SubTlt=="인사말") echo "on"; ?>">인사말</a></li> <li><a href="/sub2.php" class="<? if($SubTlt=="sub2") echo "on"; ?>">sub2</a></li><? } else if($subnum=="2") { ?> <li><a href="#none" class="<? if($SubTlt=="공지사항") 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="<? if($SubTlt=="뉴스") 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
일단 위에적어준 코드가 깨져있습니다.
<ul> 태그가 안닫혀있고, php 구문 else if문에 괄호가 안닫혀있습니다.
html, php 구문을 제대로 입력해놓으시면 아래의 script로 현재 on 돼어있는 클래스를 판별해서
아래의 스크립트로 현재 메뉴의 하위메뉴를 펼쳐지게 할 수 있습니다.
<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");
return false;
});
$(".side_menu>ul>li").each(function(i){
$(this).find("a.on").next().show();
});
});
</script>
답변을 작성하시기 전에 로그인 해주세요.
