CODEWITHSUNDEEP
javascriptjqueryaddclasssubmenuremoveclass
Mr world wide
Mr world wide

Reputation: 4814

Add active class menu not working

enter image description hereI am trying to active menu and sub menu whichever is active. If a sub menu is active, main of that should also be active.

<div id="navbar" class="navbar-collapse collapse">
    <ul id="top-menu" class="nav navbar-nav navbar-right main-nav">
        <li class="active"><a href="index.php">HOME</a></li>
        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">LEARNING CURVE<span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
                <li><a href="about-us.php">ABOUT US</a></li>
                <li><a href="content-development-program.php">CONTENT DEVELOPMENT PROGRAM</a></li>
            </ul>
        </li>
        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">SKILL UP<span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
                <li><a href="courses.php">ONLINE COURSES</a></li>
                <li><a href="skill_test.php">SKILL TEST</a></li>
                <li><a href="jobs.php">JOBS</a></li>
            </ul>
        </li>
</div>

I put the script in a js file and named it as active.js.

This is the js code:

$(function() {
    var pgurl = window.location.href.substr(window.location.href
    .lastIndexOf("/")+1);
    $("navbar ul a").each(function(){
        if($(this).attr("href") == pgurl || $(this).attr("href") == '' )
        $(this).addClass("active");
    })
});[![menu menu bare home is active now manually][1]][1]

Upvotes: 0

Views: 387

Answers (1)

Jayakumar
Jayakumar

Reputation: 101

$(this).addClass("active"); is only for applying sub menu only. You also want to apply sub menu class. user parent element class

Upvotes: 1

Related Questions