Trying to remove div in menu

I'm fairly new to jquery and try to learn as much as possible. The hardest part is knowing what to apply though. I'm trying to find the logical approach, but find it difficult most of the time.

1. I've attached an image describing my first problem here http://tinypic.com/r/8xka3c/7

2. My second开发者_C百科 problem is how to avoid a selected button to toggle? I just want it to toggle back to normal state when I press another button.

I would really appreciate your help!

My code:

$(document).ready(function () {
    var $div = $('#test');
    var height = $div.height();
    $div.hide().css({ height : 0 });

$('li#contact').click(function () {
if ($div.is(':visible')) {
    $div.animate({ height: 0 }, { duration: 250, complete: function () {
        $div.hide();
    } });
} else {
    $div.show().animate({ height : height }, { duration: 250 });
}
return false;
    });
});
   $('#nav li').click(function () {
   $('#nav li').not(this).removeClass('active'); 
   $(this).toggleClass('active');
});

To start with, .toggleClass within your click handler seems a little strange. You might try:

$('#nav li').click(function () {
    $('#nav li').removeClass('active'); 
    $(this).addClass('active');
});

To help start troubleshooting the show/hide part, you might reduce the relevant click handler to this:

$('li#contact').click(function () {
    $div.toggle(!$div.is(":visible"));
});

Try this

$(document).ready(function () {
    var $div = $('#test');
    var height = $div.height();
    $div.hide().css({ height : 0 });

    $('li#contact').click(function () {
         $div.animate({ height: $div.is(':visible')?0:height }, { duration: 250, 
           complete: function (){
            $div.toggle(!$(this).is(":visible"));
           } 
         });
       return false;
    });

   $('#nav li').click(function () {
     $('#nav li').removeClass('active'); 
     $(this).toggleClass('active');
   });
});

Maybe you want to have a look at this jsfiddle. I think it's a more elegant way to achieve what you want to do. For example, I didn't quite understand why you weren't using the jQuery function slideUp/slideDown instead of the animate function.

-> http://jsfiddle.net/SQSDq/