[jQuery] After click, two events occurring at the same time... why?
I'm developing this site, here is the current snapshot:
http://tester.hearsaynashville.com/services
If you click on either "Contact Us" or "Client Login" in the upper
left, or on the gray "Ready to Get Started?" button, you'll see a
slideDown. Excellent. Now click the same button. It scrolls up,
exactly like I want it to, all smooth and nice. Now try it again, but
click one of the buttons and then a different one. One panels slides
up at the same time as the other sliding down. Why is that? I can't
figure out how to get one panel to scroll up before the next one
scrolls down. Here's my code:
$(document).ready(function(){
$(".contact-slide").click(function(){
if ($(".panels:not(#contact-panel)").is(":visible")) {
$(".panels").slideUp("fast");
}
$("#contact-panel").slideToggle("normal");
return false;
});
$(".client-slide").click(function(){
if ($(".panels:not(#client-panel)").is(":visible")) {
$(".panels").slideUp("fast");
}
$("#client-panel").slideToggle("normal");
return false;
});
$(".getstarted-slide").click(function(){
if ($(".panels:not(#getstarted-panel)").is(":visible")) {
$(".panels").slideUp("fast");
}
$("#getstarted-panel").slideToggle("normal");
return false;
});
});