안녕하세요 서브메뉴 불러오는것 팁좀 부탁드립니다..
본문
여기에서 메뉴별 좌측에 서브메뉴 나타나게 하는 소스를 다운받아서 넣었는데요?
아주 잘나타나고 있습니다.
그런데 여기에서
저는 3차 메뉴까지 추가를 해놓은 상태인데요
해당 소스는 2차메뉴까지 있어서 3차메뉴를 어떻게 출력을 해야하는지 팁좀 부탁드립니다..
위의 링크소스는
<script type="text/javascript">
<!--
function display_submenu(num) {
document.getElementById("mysub"+num).style.display="block";
}
//-->
</script>
<style TYPE="text/css">
<!--
#mysubmenu ul {list-style:none; font-size:11pt; margin:0; padding:0;}
#mysubmenu .leftmenu_b {line-height:50px; margin-bottom:15px; background-color:#E7EDF1;border:1px solid gray;text-align:center;font-size:12pt;font-weight:bold;}
#mysubmenu .leftmenu_s {line-height:35px; margin-bottom:5px; padding-left:20px; background-color:#F2F5F9;border-bottom:1px solid gray;}
#mysubmenu a {text-decoration:none;}
#mysubmenu a:hover {color:blue;}
//-->
</style>
<div id="mysubmenu">
<?php
$sql = " select *
from {$g5['menu_table']}
where me_use = '1'
and length(me_code) = '2'
order by me_order, me_id ";
$result = sql_query($sql, false);
$gnb_zindex = 999; // gnb_1dli z-index 값 설정용
for ($i=0; $row=sql_fetch_array($result); $i++) {
?>
<ul id="mysub<?php echo $i ?>" style="display:none;">
<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" ><li class="leftmenu_b"><?php echo $row['me_name'] ?></li></a>
<?php
$sql2 = " select *
from {$g5['menu_table']}
where me_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);
//좌측 서브메뉴 전체 리스트에서 현재 페이지에 해당하는 대메뉴 리스트만 보여줌
if ( ($row['me_name']==$board['bo_subject'])||($row['me_name']==$g5['title']) ) {
echo ("<script language='javascript'> display_submenu(" .$i. " ); </script> ");
}
for ($k=0; $row2=sql_fetch_array($result2); $k++) {
if($k == 0)
echo '<ul>'.PHP_EOL;
?>
<a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" ><li class="leftmenu_s"><?php echo $row2['me_name'] ?></li></a>
<?php
//좌측 서브메뉴 전체 리스트에서 현재 페이지에 해당하는 대메뉴 리스트만 보여줌
if ( ($row2['me_name']==$board['bo_subject'])||($row2['me_name']==$g5['title']) ) {
echo ("<script language='javascript'> display_submenu(" .$i. " ); </script> ");
}
}
if($k > 0)
echo '</ul>'.PHP_EOL;
?>
</ul>
<?php } ?>
</div>
이렇게 되어있는데요
여기에 3차메뉴를 불러오는 소스는
<?
//3차메뉴 불러 오기.
$sql3 = " select *
from {$g5['menu_table']}
where me_use = '1'
and length(me_code) = '6'
and substring(me_code, 1, 4) = '{$row2['me_code']}'
order by me_order, me_id ";
$result3 = sql_query($sql3);
$num3 = sql_num_rows($result3);
if($num3>0){
echo '<ul class="snb_3dul">'.PHP_EOL;
while($row3=sql_fetch_array($result3)){
?>
<li class="snb_3dli">
<a href="<?php echo $row3['me_link']; ?>" target="_<?php echo $row3['me_target']; ?>" class="snb_3da <?php if($row3['me_code']==$me_code) { echo "on2"; }?>">- <?php echo $row3['me_name'] ?></a>
</li>
<?php
}
echo '</ul>'.PHP_EOL;
}
?>
이렇게 불러오면되는데 어떻게 넣어줘야 할지 모르겠습니다..ㅜㅜ
2차 메뉴를 뿌려주는 li class="ssn-item active" 여기 li가 닫히기전에 넣어도
2차메뉴시에는 좌측에 서브메뉴가 3차까진 잘나오는데
3차 메뉴 클릭시에는 또 좌측의 모든 서브메뉴가 사라져서 어렵네요 ㅠㅠ
팁좀 부탁드립니다 고수님들..ㅠㅠ
!-->!-->답변 1
한번도 만들어보진 않았지만, 대략 가이드를 말씀드리자면,
1. 3단 메뉴 출력 소스를 2단 메뉴 출력 부분 li 안 넣으셔야 할 것 같습니다.
2. 그런 다음, 3단 메뉴를 평상시엔 안 보이게 display 처리해놓으세요.
3. 2단 메뉴에 마우스 hover 시 3단 메뉴를 block 처리하신 후,
3단 메뉴를 position 속성을 이용해 2단 메뉴 우측에 나타나게 하셔야 할 듯..
말은 쉽게 했는데,
구글링해서 flyout 메뉴 검색해보시면 기본 html 및 css 소스를 얻으실 수 있을 거에요.
답변을 작성하시기 전에 로그인 해주세요.