jake123 jake123 - 4 years ago 137
Javascript Question

highlight the page I am currently in jQuery which is dynamically updated

I want the link to be highlighted when i am on the current link how can i do this

Index.php

<a class="menu_top" href="help_files/how_to_reg.php">How to Register</a>
<a class="menu_top" href="help_files/how_to_reset_pass.php">How to Reset Password</a>
<a class="menu_top" href="help_files/how_to_up_pix.php">How to Upload Picture</a>


jq.js

$('.menu_top').click(function(){

var href =$(this).attr('href');
$('#content_area').fadeOut().load(href).fadeIn('normal');

return false; // this code prevents us from redirecting to the page
});

Answer Source

You seem to be loading the content dynamically without reloads, so just add a class to the active anchor

$('.menu_top').click(function(){

    var href = $(this).attr('href');
    $('#content_area').fadeOut().load(href).fadeIn('normal');

    $('.menu_top').not(this).removeClass('active');
    $(this).addClass('active');

    return false;
});

and style that class however you choose

.active { 
    font-weight : bold;
    color : red;
}
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download