I have the following code which opens and closes a specific div when a button is pressed using jquery I did not use toggle as I also needed to close all the other divs in the same group.
$("#login-link").click(function(){
if ($("#login").is(":visible")){
$("#login-link").attr("src", "resources/images/menu/login.gif");
$("#email").hide();
$("#menu").hide();
$("#login").hide("slow");
} else{
$("#login-link").attr("src", "resources/images/menu/login_down.gif");
$("#email-link").attr("src", "resources/images/menu/E-mail.gif");
$("#email").hide();
$("#links").hide();
$("#menu").hide();
$("#login").show("slow", function(){
$("#email").hide();
$("#links").hide();
$("#menu").hide();
});
}
});
In every other browser I've tested the page with (chrome, safari, IE7 and firefox), this works fine and makes the div open when you click on the link and close when you click it again, in IE8 however, I have a problem. When the div is hidden it for some reason also hides the entire div in which the login-link is, the #menu-bar div. I can't work out what is causing this as I do not mention #menu-bar in my code.