Skip to content Skip to sidebar Skip to footer

How To Change Css For Active Link Based On The Hashtag

I have a situation here on how to change my active link css based on the hashtag. All the content was in the same page and I use the #url section to call the content. i have try se

Solution 1:

What I can suggest is using jQuery. Somthing like this.

$(document).ready(function(){
$('div#services_menu li').click(
    function(e)
    {
        $('div#services_menu li').removeClass('active');
        $(e.currentTarget).addClass('active');
    }
);
});


li.active a
{
    color: #BBA842!important;
}

Because, first of all you are using anchor links, and you want to make it dynamic. If any other person can suggest solution using CSS I will appreciate that answer.

Solution 2:

jQuery(function() {
      jQuery('a').each(function() {
        if (jQuery(this).attr('href')  ===  window.location.href) {
          jQuery(this).addClass('active');
        }
      });
    });  

.active {
    color: #BBA842!important;
}

Post a Comment for "How To Change Css For Active Link Based On The Hashtag"