클릭시 애드클래스를 줘서 다른 페이지로 넘어가도 호버효과가 되게
본문
클릭시 애드클래스를 주려고 하는데 잘 안되네요 ㅠㅠ
제가 하고 싶은건
이와 같이 채용공고를 누르면 다른 페이지로 넘어가게 되는데 누르면 채용공고가 채용안내와 같이 되게 하고 싶습니다.
그래서 클릭하면 active 라는 클래스를 주어서 그 링크를 누르면 그 박스는 계속 백그라운드가 채워져 있게 하고 싶습니다...(제가 설명을잘 못해서 ㅠ)
html은
<div id="left_menu">
<ul>
<li><a href="<?php echo G5_URL ?>/bbs/group1.php" class="lnba">채용안내</a></li>
<li><a href="<?php echo G5_URL ?>/bbs/group1-2.php" class="lnba">채용공고</a></li>
<li><a href="<?php echo G5_URL ?>/bbs/group1-3.php" class="lnba">채용결과</a></li>
</ul>
</div>
이렇게 되어있고 스크립트는
<script type="text/javascript">
$('#left_menu ul li a').on('click', function(){
$(this).addClass('active');
});
</script>
이렇게 해봤는데 잘 안됩니다.. 제가 원하는 효과를 구현하기 위해서는 어떻게 해야 할까요?
답변 4
li.active {background-color: #f00;}
과 같이 CSS class 가 지정되어 있어야 합니다
<?php
echo '현재페이지 파일명: '.$_SERVER['SCRIPT_NAME'];
exit;
?>
group1.php 페이지에서 위 소스를 찍어보시면 뭐라고 나올겁니다.
그 값을 if 의 조건문에 넣어주시면 되는데요
각 페이지별로 값은 다르게 나오겠지요?
그 값을 각각의 if, else if 에 넣어주시면 됩니다
됐습니다!! 정말 감사합니다 ㅠㅠ
안녕하세요 ㅎㅎ 궁금한게 게시판을 사용할때는 어떻게 설정해주어야 하나요??
스크립트 네임에 /bbs/board.php?bo_table=게시판이름 을 넣었는데 안됩니다.
게시판은 따로 하는 방법이 있을까요?
<script type="text/javascript">
$('#left_menu ul li a').on('click', function(){
$(this).addClass('active');
});
</script>
여기까지는 맞아요. 그런데 a 태그 안에 있는 것이니 return false를 해야지 하이퍼링크에 있는 url로 이동하지 않아요
<script type="text/javascript">
$(document).ready(function(){
$('#left_menu ul li a').on('click', function(){
$(this).addClass('active');
return false;
});
});
</script>
링크로 이동 후 효과가 나오게 하고 싶습니다 ㅠㅠ 그 페이지에서는 호버효과가 있게 구현하고 싶은데 잘 안되네요 ㅠㅠ
<?php
$group_style = array('','','');
if ($_SERVER['SCRIPT_NAME'] === '/group1.php')
$group_style[0] = 'active';
else if ($_SERVER['SCRIPT_NAME'] === '/group1-2.php')
$group_style[1] = 'active';
else if ($_SERVER['SCRIPT_NAME'] === '/group1-3.php')
$group_style[2] = 'active';
?>
<li><a href="<?php echo G5_URL ?>/bbs/group1.php" class="lnba <?=$group_style[0]?>">채용안내</a></li>
<li><a href="<?php echo G5_URL ?>/bbs/group1-2.php" class="lnba <?=$group_style[1]?>">채용공고</a></li>
<li><a href="<?php echo G5_URL ?>/bbs/group1-3.php" class="lnba <?=$group_style[2]?>">채용결과</a></li>
동작이 안되면 echo $_SERVER['SCRIPT_NAME']; 을 찍어 값을 확인해 보세요
동작이 안됩니다 ㅜㅜ 액티브가 안생깁니다
스크립트 네임을 찍어봤더니 /bbs/group1.php 가 나오길래 이걸로 입력해 봐도 되지 않습니다.
저 소스대로라면 left_menu ul li a 가 액티브가 되어 백그라운드 색이 나오게 할수 있는건가요?
css 가 잘못된것 같네요
li.active 가 아니라
a.active {
블라블라~
}
이게 있어야 해요
li 에 적용하려면
<li class=<?=$group_style[0]?>><a href="<?php echo G5_URL ?>/bbs/group1.php" class="lnba">채용안내</a></li>
<li class="<?=$group_style[1]?>"><a href="<?php echo G5_URL ?>/bbs/group1-2.php" class="lnba">채용공고</a></li>
<li class="<?=$group_style[2]?>"><a href="<?php echo G5_URL ?>/bbs/group1-3.php" class="lnba">채용결과</a></li>
이렇게 변경되어야 하구요
감사합니다^^