채택완료

모바일 네이게이션 바 질문입니다. (2)

2020-05-21 (목) 11:18:12 2,203

해당 버튼을 눌러 페이지 이동했을때 폰트 컬러를 바꾸고 싶은데
어떤 소스가 있을까요? 


3695970684_1590027448.0289.png

<div class="section2 cboth">
<div class="line"></div>
<ul class="cboth">

<li><a href="/m/product_list.html?type=Y&xcode=001">카테고리</a></li>
<li><a href="/m/product_list.html?type=Y&xcode=003">베스트</a></li>
<li><a href="/m/product_list.html?type=Y&xcode=006">의류</a></li>
<li><a href="/m/product_list.html?type=Y&xcode=007">헬스/뷰티</a></li>
<li><a href="/m/product_list.html?type=Y&xcode=008">생활/욕실</a></li>

</ul>
<div class="line1"></div>
</div>

답변 3개 / 댓글 5개

채택된 답변
+20 포인트

<style>
        .selected { color:red }  // red 로 변경
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
        $(document).ready(function () {
            $("li").each(function () {
                $(this).click(function () {
                    $(this).addClass("selected");  //  selected 클래스 적용 ->red 로 변경                  
                    $(this).siblings().removeClass("selected");  // siblings() ->형제 요소중, removeClass나머  지는 클래스 적용해제
                });
            });
        });
</script>

답변에 대한 댓글 2개

분명 오프라인으로 저 소스만 가저와서 테스트 해보면 되는데 사이트에선 적용이 안되네요. 소스 충돌이 있는 걸까요?
네 분명 되는 소스 인데 메이크샵에선 안먹히네요. ㅠㅠ

<script src="http://code.jquery.com/jquery-latest.js"></script>

온라인 연결 되어야 합니다

2020-05-21 (목) 12:26:25


<style>
    li.active a{color : blue;}
</style>

<div class="section2 cboth">
<div class="line"></div>
<ul class="cboth">

<li <?php if($xcode == '001'){?> class="active" <?php }?>><a href="/m/product_list.html?type=Y&xcode=001">카테고리</a></li>
<li <?php if($xcode == '002'){?> class="active" <?php }?>><a href="/m/product_list.html?type=Y&xcode=003">베스트</a></li>
<li <?php if($xcode == '003'){?> class="active" <?php }?>><a href="/m/product_list.html?type=Y&xcode=006">의류</a></li>
<li <?php if($xcode == '004'){?> class="active" <?php }?>><a href="/m/product_list.html?type=Y&xcode=007">헬스/뷰티</a></li>
<li <?php if($xcode == '005'){?> class="active" <?php }?>><a href="/m/product_list.html?type=Y&xcode=008">생활/욕실</a></li>

</ul>
<div class="line1"></div>
</div>

답변에 대한 댓글 3개

li 안에 저 소스를 넣어서 그런지 아님 안맞는 솔루션인지 모르겠는데..
오류가 나네요.. 왜그럴까요? ㅜㅜ
음.. 소스를 보시면

<style>
=>active 라는 클래스의 a태그에는 blue 글자색상을 줍니다.

<li <?php if($xcode == '001'){?> class="active" <?php }?>>
=> $xcode의 변수값이 001 이라면 active라는 클래스를 줍니다.

결과
=> 현제 페이지의 $xcode값(활성화된 값이겠죠)에 따라 blue 색상이 들어갑니다.

복붙하시면 안될수도 있고 제가 설명드린것을 참조하여서 소스를 수정해보세요
어떤 말씀이신진 이해했는데 소스수정을 아무리 해도 오류가 나네요.. 실패입니다. ㅠㅠ

<?php if($xcode == '002'){?> class="active" <?php }?>

저 문장을 밖으로 뺐다가 넣었다가 다해봤는데도 잘 안되네요..ㅠㅠ 능력이 부족한 탓입니다. ㅠㅠ

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