서브메뉴 클릭시 선택된 메뉴명에 클래스 추가 (active) 하는 방법

서브메뉴 클릭시 선택된 메뉴명에 클래스 추가 (active) 하는 방법

QA

서브메뉴 클릭시 선택된 메뉴명에 클래스 추가 (active) 하는 방법

답변 1

본문

안녕하세요. 아래와 같이 skin을 사용해서 좌측서브메뉴를 사용하는데,
서브메뉴 .leftmenu_b 를 클릭하여 페이지를 이동했을시 현재 페이지에 클릭한 메뉴에만 클래스를 추가해서 하이라이트를 주고 싶습니다.. 어떻게 하는게 좋을까요?

답변 부탁드리겠습니다..!


<script type="text/javascript">
    function display_submenu(num) { 
         document.getElementById("mysub"+num).style.display="block";
    }
</script>
<style TYPE="text/css">
#left_submenu {position: absolute; left: -250px; top: 60px; width: 200px;}
#left_submenu ul {list-style:none; margin:0; padding:0;}
#left_submenu .leftmenu_b {line-height:70px; background-color:#192535; text-align:center;font-size:18px;font-weight:bold; color: #fff;}
#left_submenu .leftmenu_s {line-height:50px; padding-left:20px; border: 1px solid #aaa; border-bottom:none; font-weight: bold; font-size:14px; background:#fff url(/theme/company/img/submenu_arrow.png) no-repeat 150px 10px}
#left_submenu .leftmenu_s:hover{background: #b5c0ce;}
#left_submenu .leftmenu_s_on{background: #000;}
#left_submenu .leftmenu_bottom{height: 4px; background: #192535;}
#left_submenu a {text-decoration:none; display: block;}
#left_submenu a:active {background: #b5c0ce;}
</style>
<div id="left_submenu">
    <?php
    $gnb_menus = array();
    
    $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
            $submenus = '';
        
            $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;
            ?>
            <li class="leftmenu_bottom"></li>
    </ul>
    <?php } ?>

</div>

 

이 질문에 댓글 쓰기 :

답변 1

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 88
© SIRSOFT
현재 페이지 제일 처음으로