CODEWITHSUNDEEP
javascriptjqueryhtml
kinduff
kinduff

Reputation: 142

jQuery show&hide menu basics

I'm trying to make a doble menu, with click function and hide&show basics, but I don't understand why is not working, can you help me out? Here is my script:

$(document).ready(function() {

$('#work').click(function(event){
    $(this).addClass("activado"); // add active class
    $("#other,#contacto").removeClass("activado"); // remove active class
    $("#menuother").hide();
    $("#menuwork").show();
});

$('#other').click(function(event){
    $(this).addClass("activado");
    $("#work,#contacto").removeClass("activado");
    $("#menuwork").hide();
    $("#menuother").show();
});

$('#contacto').click(function(event){
    $(this).addClass("activado");
    $("#work,#other").removeClass("activado");
    $("#menuwork").hide();
});
});

And my html is very basic, i don't think you need it, the script speaks it self. The active class is working, but the hide & show is not.

Thanks a lot.

//edit By the way, I'm hiding the menus in css.

//edit adding html

<a href="#" id="work" class="inactivo">TopMenu</a>
<a href="#" id="other" class="inactivo">TopMenu</a>
<a href="#" id="contacto" class="inactivo">TopMenu</a>

<div id="#menuwork">
<a href="#" id="SubMenu1" class="inactivo">SubMenu</a>
<a href="#" id="SubMenu2" class="inactivo">SubMenu</a>
<a href="#" id="SubMenu3" class="inactivo">SubMenu</a>
</div>

<div id="#menuother">
<a href="#" id="SubMenu4" class="inactivo">SubMenu</a>
<a href="#" id="SubMenu5" class="inactivo">SubMenu</a>
<a href="#" id="SubMenu6" class="inactivo">SubMenu</a>
</div>

Upvotes: 2

Views: 187

Answers (3)

jbabey
jbabey

Reputation: 46647

You can do this without having to make classes for active and inactive

http://jsfiddle.net/xQ64g/16/

Upvotes: 0

tereško
tereško

Reputation: 58444

That is not how you create menus .. ehh ...

http://jsbin.com/itolul/13/edit#preview

Upvotes: 1

Colin Brock
Colin Brock

Reputation: 21565

For starters, remove the # from the ID's in your div elements. For example:

<div id="#menuwork">

should be:

<div id="menuwork">

Upvotes: 4

Related Questions