сделал пример на чистом js
<!DOCTYPE HTML>
<html>
<head>
<style>
.open {
display:block;
}
.close{
display:none;
}
</style>
</head>
<body>
<a href="#" id="login">login</a>
<div id="container">
<form id="loginForm">
<h2>hellow, world</h2>
</form>
</div>
<script>
function $(selector){//используеться что бы не писать document.getElement...
return document.querySelector(selector);
}
!function () {
var cont = $("#container");
cont.className = "open";
document.body.onclick = function (e) {
var target = event.srcElement||e.target ;
if(target.id == "login"){
ChangeStateContainer();
return false;
}
cont.className = "close";
};
function ChangeStateContainer()
{
if(cont.className == "open"){
cont.className = "close";
}
else cont.className = "open";
}
}();
</script>
</body>
</html>