탭 버튼 온앤오프2

php

<ul class="sub_bo_ul">
    <li class="sub_bo_item"><a href="<?=get_pretty_url('보테이블','','sca='.urlencode('1'))?>"><span class="game_icon_off"></span><em class="uname">1</em></a></li>
    <li class="sub_bo_item"><a href="<?=get_pretty_url('보테이블','','sca='.urlencode('2'))?>"><span class="game_icon_off"></span><em class="uname">2</em></a></li>
    <li class="sub_bo_item"><a href="<?=get_pretty_url('보테이블','','sca='.urlencode('3'))?>"><span class="game_icon_off"></span><em class="uname">3</em></a></li>
    <li class="sub_bo_item"><a href="<?=get_pretty_url('보테이블','','sca='.urlencode('4'))?>"><span class="game_icon_off"></span><em class="uname">4</em></a></li>
</ul>

그누로 홈피 제작하다보면 할 수 없이 레거시로 하게되는데..

약간 spa 같이 구현 해야되는 기능이 있어서 일단 만들어봄..

브라우저 주소랑 탭버튼에 남겨 있는 링크가 동일 하면 on 클래스를 준다.

var full_path = window.location.href;
$('.sub_bo_ul .sub_bo_item a').each(function (ele,val) {
   let href = decodeURIComponent($(val).attr('href'));
   if(href === decodeURIComponent(full_path)) {
       $(this).parent().addClass('active');
       $(this).find('span').removeClass("brand_icon_off").addClass("brand_icon_on");
   }
});

탭 버튼 온앤오프2 #

탭 버튼 온앤오프2