<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.3.min.js'>
</script>
</head>
<body>
<div style='z-index: 1; background: #555555; width: 100px; height: 50px; position: absolute; top: 50px' id='large'>
</div>
<div style='display: none; background: orange; width: 70px; height: 30px; position: absolute; left: 22px; top: 40px' id='small'>
</div>
<script type='text/javascript'>
$("#large").one("click", function () {
var callee = arguments.callee, t = $(this);
if (this.clicked = !this.clicked)
$("#small").show().animate({
top: "20px"
}, 300, function () {
t.one("click", callee);
});
else
$("#small").fadeOut("normal", function () {
t.one("click", callee);
$(this).css("top", "50px");
});
});
</script>
</body>
</html>