Search code examples
jqueryslidedown

jQuery slideUp and slideDwon issues


I need the classes 'two and three' to be hidden as soon as the page load and than be able to click again on the menu to slide it down, I am having probles with the following code:

$(document).ready(function() 
{

$('.two, .three').slideUp('slow');

$('.active_wrapper').click(function(){
    $('.two, .three').slideDown('slow');
});

});

HTML

<div class="nav_wrapper">

    <div class="active_wrapper one"><a class="active" href="">home</a></div>

    <div class="two"><a href="about.html">about</a></div>

    <div class="three"><a href="project.html">project</a></div>

</div>

Solution

  • Try it like this - DEMO

    $(document).ready(function() 
    {
    
    $('.two, .three').slideUp('slow');
    
    $('.active_wrapper').click(function(e){
        e.preventDefault();
        $('.two, .three').slideToggle('slow');
    });
    
    });​