메뉴설정시 active class 문제

메뉴설정시 active class 문제

QA

메뉴설정시 active class 문제

본문

eyekiss 님께서 올리라고 하셔서 다시 올립니다.

영카트 어드민 메뉴설정 시 

shop.head.php 부분 리메이크 중입니다.

 

그림으로  설명드릴께요 ~!  디자인부분이라 그편이 빠르겠죠. . .

 

2040730373_1525633810.9494.jpg

css에서  .active가 적용되면 이렇게 보여야 합니다.

메뉴가 현재 사이트url부분을 가르키도록 . . . 디자인 되어 있죠 

 

2040730373_1525633978.8172.jpg

이건 서브 메뉴 부분이고요 ! 이런식으로 . .. 

 

2040730373_1525634030.0069.jpg

 

이건 모바일 화면 .dropdown  css 적용부분 메뉴죠  이런식으로 되어야 하지요 ~! 

이해 돼시죠 !

밑에 코드는 연구하던거 올립니다.

sub메뉴부분도 css class 설정전이라 많이 꼬여 있습니다.  <div></div> 안닫은 거 있을지 모르겠네요 ~!   

영카트메뉴라서 상품메뉴설정과 주메뉴설정이 분리되 있어서 복잡합니다. 

 

 


    <div class="navbar navbar-inverse" role="banner">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a href="<?=G5_URL ?>/index.php" class="navbar-brand">
                <h1><img src="<?=G5_THEME_URL ?>/images/logo.png" alt="<?php echo $config['cf_title']; ?> 메인"></h1>
                </a>
            </div>
            <!--div id="logo">
                <a class="navbar-brand" href="<?php echo G5_URL; ?>/">
                <h1><img src="<?php echo G5_THEME_IMG_URL ?>/logo.png" alt="<?php echo $config['cf_title']; ?> 메인"></h1>
                </a>
            </div-->
            <?php include_once(G5_THEME_MSHOP_PATH.'/category.php'); // 분류 ?>
            
        <!--div id="category-full" -->
            <div class="collapse navbar-collapse">
                <!-- 메뉴 설정 -->
                <ul class="nav navbar-nav navbar-right">
                    <?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++) {
                    ?>
                    <?php
                        if($bo_table) {
                            if(strpos($row['me_link'], 'bo_table='.$bo_table) !== false) {
                            $active = ' active';
                            }
                        } else if(strpos($row['me_link'], $_SERVER['PHP_SELF']) !== false) {
                        $active = ' true';
                        }
                        //if(!$mnum) $mnum = 0;
                        //$active = $i==$mnum? ' active' : '';
                        //if($i !=0 && $i !=5 && $i !=6) 
                           echo "<li class='dropdown{$active}'>".PHP_EOL;
                        //else 
                        //   echo "<li class='active'>".PHP_EOL;
                       
                    ?>
                    
                      <!--li class="dropdown active"-->
                        <a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="">
                        <?php echo $row['me_name'] ?>
                        <i class="fa fa-angle-down"></i>
                        </a>
                        <ul role="menu" class="sub-menu">
                        <!--?php
                        if($i >= 0)
                            echo '<ul role="menu" class="sub-menu">'.PHP_EOL;
                        else 
                            echo '<ul>'.PHP_EOL;
                        ?-->
                        <?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);
                        for ($k=0; $row2=sql_fetch_array($result2); $k++) {
                            if($k == 0)
                                echo '<ul class="cate-ul-2" style="margin:0; padding:0;">'.PHP_EOL;
                        ?>
                            <!--li class="cate-li-2" style=""-->
                            <?php
                                if(!$sub) $sub = 0;
                                $active_2 = $k==$sub? ' active' : '';
                                if($k !=0 && $k !=2 && $k !=3) 
                                   echo "<li class='drop{$active_2}'>".PHP_EOL;
                                else 
                                   echo "<li class='$active_2'>".PHP_EOL;
                            ?>
                                <a href="<?php echo $row2['me_link']; ?>?sub=<?=$k?>" target="_<?php echo $row2['me_target']; ?>" class="">
                                    <?php echo $row2['me_name'] ?>
                                </a>
                            </li>
                        <?php
                        }
                        if($k > 0)
                            echo '</ul>'.PHP_EOL;
                        ?>
                        </ul>
                    </li>
                    <?php
                    }
                    if ($i == 0) {  ?>
                        <li id="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
                    <?php } ?>
                </ul>
                <!-- 메뉴 설정 end -->
            </div>
            <div>
                <?php
                $mshop_ca_href = G5_SHOP_URL.'/list.php?ca_id=';
                $mshop_ca_res1 = sql_query(get_mshop_category('', 2));
                for($i=0; $mshop_ca_row1=sql_fetch_array($mshop_ca_res1); $i++) {
                    if($i == 0)
                        echo '<ul class="nav navbar-nav navbar-right">'.PHP_EOL;
                ?>
                    <?php
                    if($i > 0)
                         echo '<li>'.PHP_EOL;
                    else
                         echo '<li class="dropdown">'.PHP_EOL;
                    ?>
                        <a href="<?php echo $mshop_ca_href.$mshop_ca_row1['ca_id']; ?>"><?php echo get_text($mshop_ca_row1['ca_name']); ?><i class="fa fa-angle-down"></i></a>
                        
                        <!--add role menu -->
                        <?php
                        if($i > 0)
                             echo '<ul>'.PHP_EOL;
                        else
                             echo '<ul role="menu" class="sub-menu">'.PHP_EOL;
                        ?>
                        <?php
                        $mshop_ca_res2 = sql_query(get_mshop_category($mshop_ca_row1['ca_id'], 4));
                        
                        for($j=0; $mshop_ca_row2=sql_fetch_array($mshop_ca_res2); $j++) {
                            if($j == 0)
                                echo '<ul class="cate-ul-2" style="margin:0;padding:0;">'.PHP_EOL;
                        ?>
                            <li class="cate-li-2">
                                <a href="<?php echo $mshop_ca_href.$mshop_ca_row2['ca_id']; ?>">
                                    <?php echo get_text($mshop_ca_row2['ca_name']); ?>
                                </a>
                                <?php
                                $mshop_ca_res3 = sql_query(get_mshop_category($mshop_ca_row2['ca_id'], 6));   
                                for($k=0; $mshop_ca_row3=sql_fetch_array($mshop_ca_res3); $k++) {
                                    if($k == 0)
                                        echo '<ul class="cate-ul-3">'.PHP_EOL;
                                ?>
                                    <li class="cate-li-3">
                                        <a href="<?php echo $mshop_ca_href.$mshop_ca_row3['ca_id']; ?>"><?php echo get_text($mshop_ca_row3['ca_name']); ?></a>
                                        <?php
                                        $mshop_ca_res4 = sql_query(get_mshop_category($mshop_ca_row3['ca_id'], 8));
                                        
                                        for($m=0; $mshop_ca_row4=sql_fetch_array($mshop_ca_res4); $m++) {
                                            if($m == 0)
                                                echo '<ul class="cate-ul-4">'.PHP_EOL;
                                        ?>
                                            <li class="cate-li-4">
                                                <a href="<?php echo $mshop_ca_href.$mshop_ca_row4['ca_id']; ?>"><?php echo get_text($mshop_ca_row4['ca_name']); ?></a>
                                                <?php
                                                $mshop_ca_res5 = sql_query(get_mshop_category($mshop_ca_row4['ca_id'], 10));
                                                for($n=0; $mshop_ca_row5=sql_fetch_array($mshop_ca_res5); $n++) {
                                                    if($n == 0)
                                                        echo '<ul class="cate-ul-5">'.PHP_EOL;
                                                ?>
                                                    <li class="cate-li-5">
                                                        <a href="<?php echo $mshop_ca_href.$mshop_ca_row5['ca_id']; ?>"><?php echo get_text($mshop_ca_row5['ca_name']); ?></a>
                                                    </li>
                                                <?php
                                                }
                                                if($n > 0)
                                                    echo '</ul>'.PHP_EOL;
                                                ?>
                                            </li>
                                        <?php
                                        }
                                        if($m > 0)
                                            echo '</ul>'.PHP_EOL;
                                        ?>
                                    </li>                       
                                <?php
                                }
                                if($k > 0)
                                    echo '</ul>'.PHP_EOL;
                                ?>
                            </li>
                        <?php
                        }
                        if($j > 0)
                            echo '</ul>'.PHP_EOL;
                        ?>
                        </ul>
                        <!--add role menu end -->
                    </li>
                <?php
                }
                if($i > 0)
                    echo '</ul>'.PHP_EOL;
                else
                    echo '<p>등록된 분류가 없습니다.</p>'.PHP_EOL;
                ?>
            </div>
            
           <div class="search">
            <button type="button" id="hd_sch_open">검색<span class="sound_only"> 열기</span>               </button>
            <!--search -->
            <form role="form" id="formsearch" name="frmsearch1" action="<?php echo G5_SHOP_URL; ?>/search.php" onsubmit="return search_submit(this);">
            <i class="fa fa-search"></i>
            <aside id="hd_sch">
                <div class="sch_inner">
                    <h2>상품 검색</h2>
                    <label for="sch_str" class="sound_only">상품명<strong class="sound_only"> 필수</strong></label>
                    <input type="text" name="q" value="<?php echo stripslashes(get_text(get_search_string($q))); ?>" id="sch_str" required class="frm_input">
                    <input type="submit" value="검색" class="btn_submit">
                    <button type="button" class="pop_close"><span class="sound_only">검색 </span>닫기</button>
                </div>
            </aside>
            </form>
            <script>
                $(function (){
                var $hd_sch = $("#hd_sch");
                $("#hd_sch_open").click(function(){
                    $hd_sch.css("display","block");
                });
                $("#hd_sch .pop_close").click(function(){
                    $hd_sch.css("display","none");
                });
            });
            function search_submit(f) {
                if (f.q.value.length < 2) {
                    alert("검색어는 두글자 이상 입력하십시오.");
                    f.q.select();
                    f.q.focus();
                    return false;
                }
                return true;
            }
            </script>
    </div>
</div>

이 질문에 댓글 쓰기 :

답변 2

중간에 서브 메뉴 나오는 부분 수정했습니다.


<!--li class="cate-li-2" style=""-->
<?php
$active_2 = "";
if($bo_table) {
if(strpos($row2['me_link'], 'bo_table='.$bo_table) !== false) {
$active_2 = ' active';
}
} else if(strpos($row2['me_link'], $_SERVER['PHP_SELF']) !== false) {
$active_2 = ' true';
}
if($k !=0 && $k !=2 && $k !=3)
echo "<li class='drop{$active_2}'>".PHP_EOL;
else
echo "<li class='$active_2'>".PHP_EOL;
?>

예 고쳤습니다.

문제는 만드신 주메뉴 수정시...

if($bo_table) {

                    if(strpos($row2['me_link'], 'bo_table='.$bo_table) !== false) {

                        $active = ' active';

                    }

                } else if(strpos($row2['me_link'], $_SERVER['PHP_SELF']) !== false) {6
                        $active = ' active';

                }
이코드가

주메뉴 active 시  색깔이 다바뀌어 버립니다.  위 그림처첨 보입니다.

blog 메뉴 active시 아래처럼 보인다는게 문제 busi 메뉴와 home 메뉴는 눌러도 색갈 반응이 없습니다. 

2040730373_1525681154.3286.jpg

변수 선언하는 부분 추가해보세요.
                        $active = '';
                        if($bo_table) {
                            if(strpos($row['me_link'], 'bo_table='.$bo_table) !== false) {
                            $active = ' active';
                            }
                        } else if(strpos($row['me_link'], $_SERVER['PHP_SELF']) !== false) {
                            $active = ' true';
                        }

이렇게 수정했더니 동작하네요 ~!
true 를 active로 설정했더니 바뀌는군요
이 문제로 몇일동안 끙끙 거렸습니다.

갑사합니다.
제게 php는 수학문제 풀이 같네요
디자이너의 한계지요

좀더 열심히 연구하고 질문하고 해야할 것 같습니다.
다음에 또 뵈요 ~! 


$active = '';
                        if($bo_table) {
                            if(strpos($row['me_link'], 'bo_table='.$bo_table) !== false) {
                            $active = ' active';
                            }
                        } else if(strpos($row['me_link'], $_SERVER['PHP_SELF']) !== false) {
                            $active = ' active';
                        }
                          echo "<li class='dropdown{$active}'>".PHP_EOL;
                     
                    ?>

답변을 작성하시기 전에 로그인 해주세요.
전체 123,139 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT