onClick script "stalling" [Archive]

cssmatt

03-03-2006, 05:05 PM

I have the following code, which make a DIV appear and disapear ...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
#login {
position: absolute;
top: 170px;
left: 606px;
width: 250px;
height: 150px;
background-color: #CCFF99;
color: #000000;
border: 1px solid #000000;
padding: 10px 10px 10px 10px;
visibility: hidden;
z-index: 15;
}
</style>

<script type="text/javascript">
function showLogin(login) {
if (document.getElementById(login).style.visibility == 'hidden') {
document.getElementById(login).style.visibility = 'visible'
} else {
document.getElementById(login).style.visibility = 'hidden'
}
}
</script>

</head>

<body>

<div id = "login"><?php include ("http://www.bradmush.co.uk/loc/login.php"); ?></div>
<a onclick="showLogin('login');" href = "#">Log In</a>
</body>
</html>

But when i load the page, and click the link nothing happens, but click again and it works fine. Its just the first click?! Anybody know why??

Thanks

Kor

03-03-2006, 05:25 PM

you have no style, you have an id and CSS attribtes, which is not the same thing. Switch the condition

function showLogin(login) {

if (document.getElementById(login).style.visibility == 'visible') {
document.getElementById(login).style.visibility = 'hidden'
} else {
document.getElementById(login).style.visibility = 'visible'
}
}