테스트 사이트 - 개발 중인 베타 버전입니다

사이드메뉴 클릭시 메뉴 글자색 빨간색으로 변화 주기 채택완료

따로또같이 2년 전 조회 1,943

이럭저력 고수님들의 도움으로 사이드메뉴(3차메뉴)까지 구현 성공 하였으니.

링크 주소와 같이 해당메뉴를 클릭하면 빨간으로 변화 주고 싶은데 제 머리론 힘든것 같습니다.

현재사용되고 있는 소스 다름과 같습니다.

어디를 수정해야 할지 아니면 추가를 해야 할지 고수님의 조언 부탁 드립니다.

</p>

<p><?php

if (!defined('_GNUBOARD_')) exit;</p>

<p>if($bo_table){

$menu_url = G5_URL."/bbs/board.php?bo_table=".$bo_table;

}else{

$menu_url = G5_URL.$_SERVER['REQUEST_URI'];

}

$menu = sql_fetch(" select * from {$g5['menu_table']} where me_use = '1' and me_link = '$menu_url' ");

$me_code = substr($menu['me_code'],0,2);

?>

<script type="text/javascript">

function display_submenu(num) {

    document.getElementById("mysub"+num).style.display="block";

}

</script>

<script>

// 지우지 말아주세요. 새창 등에서도 사용합니다.

$(document).ready(function() {

    $("#mysubmenu a").on("click", function(e){ //링크 클릭시

        var $data_midtxt = $(this).attr("data-midtxt");

        if( $data_midtxt ){

            $.cookie('sub_midtxt', $data_midtxt, { path: '/' });

        } else {

            $.cookie('sub_midtxt', null, { path: '/' });

        }

    });

});

</script>

  <style>

 #mysubmenu  {border: 1px solid #d2d9e6; border-bottom: 1px solid #c1ccda;margin:0px 15px 15px;background:#fff;position:relative;

 -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1);

 -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1);

 box-shadow:0 1px 2px rgba(0,0,0,0.1)}

 #mysubmenu ul {list-style:none; margin:0; padding:0;}

 #mysubmenu li { margin: 0; list-style: none;}</p>

<p> #mysubmenu li.leftmenu_b {line-height:35px; margin-top:0px; padding:5px 0 3px 35px; border-bottom:0px solid #dddddd; text-align:left; font-size:14pt; font-weight:bold; background:#d1d1d1; }

 #mysubmenu li.leftmenu_b a{ color:#F70303; }</p>

<p> #mysubmenu li.leftmenu_s {line-height:33px; margin-bottom:0px; padding-left:35px; border-bottom:0px solid #e6e6e6; font-size:12pt;font-weight:bold; background:#fff; color:#333; }

 #mysubmenu li.leftmenu_s:hover { background:#fff;color:#F40B6E; }</p>

<p> #mysubmenu li.leftmenu_s_on {line-height:33px; margin-bottom:0px; padding-left:35px; border-bottom:0px solid #e6e6e6; font-size:12pt;font-weight:bold; background:#5aacca; color:#C3E4F1;  }

 #mysubmenu li.leftmenu_s_on a{ color:#C3E4F1; }</p>

<p> #mysubmenu li.leftmenu_s a:focus, #mysubmenu li.leftmenu_s a:hover { color:#fff;color:#F40B6E;}</p>

<p> #mysubmenu li.leftmenu_c {line-height:33px; margin-bottom:0px; padding-left:15px; border-bottom:0px solid #e6e6e6; font-size:12pt;font-weight:bold; background:#fff; color:#333; }

 #mysubmenu li.leftmenu_c:hover { background:#fff;color:#F40B6E; }</p>

<p> #mysubmenu li.leftmenu_c_on {line-height:33px; margin-bottom:0px; padding-left:35px; border-bottom:0px solid #e6e6e6; font-size:12pt;font-weight:bold; background:#5aacca; color:#C3E4F1;  }

 #mysubmenu li.leftmenu_c_on a{ color:#C3E4F1; }</p>

<p> #mysubmenu li.leftmenu_c a:focus, #mysubmenu li.leftmenu_s a:hover { color:#fff;color:#F40B6E;}

 </style>

    <div id="mysubmenu"></p>

<p><?php

        $tmp_code = substr($me_code,0,2);

        $tmp_menu_name=sql_fetch(" select * from {$g5['menu_table']} where me_use = '1' and length(me_code) = '2' and me_code = '$tmp_code' ");

        ?></p>

<p>    <li class="leftmenu_b"><font color=#F70303><h3><?=$tmp_menu_name['me_name']?></h3></font>

<li>

        <?</p>

<p>        $sql2 = " select *

                    from {$g5['menu_table']}

                    where me_use = '1'

                      and length(me_code) = '4'

                      and substring(me_code, 1, 2) = '$tmp_code'

                    order by me_order,me_code, me_id ";

        $result2 = sql_query($sql2);</p>

<p>        for ($k=0; $row2=sql_fetch_array($result2); $k++) {

            if($k == 0)

                echo '<ul class="snb_2dul">'.PHP_EOL;

        ?>

            <li class="leftmenu_s">

                <a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="leftmenu_s <?php if($row2['me_code']==substr($me_code,0,4)) { echo "on"; }?>"><?php echo $row2['me_name'] ?></a>

        <?php</p>

<p>            //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_code, 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="leftmenu_c">

                        <a href="<?php echo $row3['me_link']; ?>" target="_<?php echo $row3['me_target']; ?>" class="leftmenu_c <?php if($row3['me_code']==$me_code) { echo "on2"; }?>">-<?php echo $row3['me_name'] ?></a>

                    </li>

        <?php

                }

                echo '</ul>'.PHP_EOL;

            }

            echo '</li>'.PHP_EOL;                    </p>

<p>        }</p>

<p>        if($k > 0)

            echo '</ul>'.PHP_EOL;

        ?>

       </p>

<p></div></p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
들레아빠

class="leftmenu_s <?php if($row2['me_code']==substr($me_code,0,4)) { echo "on"; }?>"

==>>

class="leftmenu_s_<?php if($row2['me_code']==substr($me_code,0,4)) { echo 'on'; }?>"

로그인 후 평가할 수 있습니다

답변에 대한 댓글 3개

따로또같이
2년 전
감사합니다.
언더바가 문제 있었군요
따로또같이
2년 전
사이드메뉴 클릭시 빨간색 유지가 안되네요
들레아빠
2년 전
#mysubmenu li.leftmenu_s_on
=> li 제거
#mysubmenu .leftmenu_s_on

조건이 맞는지 확인이 필요합니다.
if($row2['me_code']==substr($me_code,0,4))
[code]
<div id="mysubmenu">
<?php
$tmp_code = substr($me_code, 0, 2);
$tmp_menu_name = sql_fetch(" select * from {$g5['menu_table']} where me_use = '1' and length(me_code) = '2' and me_code = '$tmp_code' ");
?>
<li class="leftmenu_b"><font color=#F70303><h3><?= $tmp_menu_name['me_name'] ?></h3></font>
<li>
<?php
$sql2 = " select *
from {$g5['menu_table']}
where me_use = '1'
and length(me_code) = '4'
and substring(me_code, 1, 2) = '$tmp_code'
order by me_order, me_code, me_id ";
$result2 = sql_query($sql2);
for ($k = 0; $row2 = sql_fetch_array($result2); $k++) {
if ($k == 0)
echo '<ul class="snb_2dul">' . PHP_EOL;
?>
<li class="leftmenu_s_<?php if ($row2['me_code'] == substr($me_code, 0, 4)) {
echo "on";
} ?>">
<a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="leftmenu_s"><?php echo $row2['me_name'] ?></a>
<?php
// 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_code, 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="leftmenu_c_<?php if ($row3['me_code'] == $me_code) {
echo "on2";
} ?>">
<a href="<?php echo $row3['me_link']; ?>" target="_<?php echo $row3['me_target']; ?>"
class="leftmenu_c">-<?php echo $row3['me_name'] ?></a>
</li>
<?php
}
echo '</ul>' . PHP_EOL;
}
echo '</li>' . PHP_EOL;
}
if ($k > 0)
echo '</ul>' . PHP_EOL;
?>
</div>
[/code]

댓글을 작성하려면 로그인이 필요합니다.

다음과 같은 방법으로 시도해 볼 수 있을 것 같습니다.

먼저, 좌측 메뉴 항목에 해당 메뉴를 식별하는 클래스를 추가합니다.

</p>

<p>// 좌측 메뉴 항목에 클래스 추가

<a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="leftmenu_s <?php if($row2['me_code']==substr($me_code,0,4)) { echo "on"; }?>"><?php echo $row2['me_name'] ?></a>

 

그런 다음, 아래의 JavaScript 코드를 사용하여 선택된 메뉴를 클릭했을 때 좌측 메뉴 항목에 클래스 on을 추가하고, 다른 항목의 on 클래스를 제거하면 될 것 같네요

</p>

<p><script>

$(document).ready(function() {

    $("#mysubmenu a").on("click", function(e) {

        // 이전에 선택된 메뉴 항목의 'on' 클래스를 제거

        $("#mysubmenu a").removeClass("on");

        

        // 현재 클릭한 메뉴 항목에 'on' 클래스 추가

        $(this).addClass("on");

        

        var $data_midtxt = $(this).attr("data-midtxt");

        if ($data_midtxt) {

            $.cookie('sub_midtxt', $data_midtxt, { path: '/' });

        } else {

            $.cookie('sub_midtxt', null, { path: '/' });

        }

    });

});

</script>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

따로또같이
2년 전
위소스로 해서 잘 안되는대요

댓글을 작성하려면 로그인이 필요합니다.

웅푸
2년 전

현재 빨간색으로 나오고 있는것 아닌가요?;;;

상위메뉴

color:#F70303; 

하위메뉴

color:#F40B6E;

현재 이렇게 되어있는데요? ;;;--;;;

로그인 후 평가할 수 있습니다

답변에 대한 댓글 7개

따로또같이
2년 전
해당 싸이트 들어 가보세요.
클릭해도 글자 색이 변화 없음.
저도 그렇게 생각 해봤는데 전혀 변화가 없네요. 이상합니다
http://ace.korea505.com
혹시 active라든가 visit 부분이 빠진것 아닐까요
따로또같이
2년 전
클릭시 했을때 빨간색 유지
웅프
2년 전
그누에서 서브메뉴는 마우스 오버기능 스크립트 처리로 스탑이 않됩니다.
또한 css 에서 처리 또한 않됩니다.
그렇다면
이문제를 해결방법은 없을까요? 있습니다.

에코 처리 된부분에서 직접 스타일을 정의 해 주시면 해결됩니다.
따로또같이
2년 전
초보라 무슨뜻인지 잘 모르겠습니다.
"에코 처리 된부분에서 직접 스타일을 정의 해 주시면 해결됩니다."
이부분을 어떻게 정의 할까요?
소스좀 올려 주시면 안될까요?
웅프
2년 전
일단 스타일에서 호버처리 해보세요
.snb_3dul:hover {
background-color: #F40B6E;
}
이런식으로 해보시고 만약에 않되시면......


그때는
해당 폰트 직접 처리 해야합니다.
echo " style='color:#F40B6E;'";
또는 백그라운드
echo " style='background-color:#F40B6E;'";
이런식으로 요
웅프
2년 전
하나더 해볼까요?

<a href="<?php echo $row3['me_link']; ?>" target="_<?php echo $row3['me_target']; ?>" class="leftmenu_c <?php if($row3['me_code'] == $me_code) { echo "on2"; } ?>" style="color: red; text-decoration: underline;">-<?php echo $row3['me_name'] ?></a>
따로또같이
2년 전
수고 많이 하시는데 잘 안됩니다.
클릭도 안했는데 빨간색 및 밑줄이 생깁니다
===================
일단 스타일에서 호버처리 해보세요
.snb_3dul:hover {
background-color: #F40B6E;
}
이런식으로 해보시고 만약에 않되시면......


그때는
해당 폰트 직접 처리 해야합니다.
echo " style='color:#F40B6E;'";
또는 백그라운드
echo " style='background-color:#F40B6E;'";
이런식으로 요.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인