Hey All,
I've searched through the forum already but I couldn't find what I'm looking for. Maybe someone here would be able to help me out.

I'm trying to create a slide down login form on the header (something similar to search box at www.lullabot.com). But I couldn't find the solution on how to create that.

Can anyone help me out with that?

Thanks in advance.

Comments

JonGirard-1’s picture

Start out with the simple stuff first, then add the fancy slide effects after you get this working ;)

Give something like this a try,

<script type="text/javascript">$(document).ready(function() {
        $('#menulink').click( function() {
    $('#menucontainer').toggle('slow');
	}else {
	$('#menucontainer').toggle('slow');
	}
   });
</script>

Assuming the link to make it drop down is called "menulink" in a div, and the container which the drop down menu is enclosed in is called "menucontainer".

Make sure in the stylesheet you also give "#menucontainer" a style of "display:none;" so that it will start off as contracted.

omerle’s picture

maybe give a more specific code?
of a complete block?
I tried something like this but it didn't work:
login.js file:
if (Drupal.jsEnabled) {
$(document).ready(function() {

$('#user-login-form').hide()
$('div.superkali').click( function() {
$('#user-login-form').show('slow');
}
else {
$('#user-login-form').hide('slow');
return false;
}
});
});

I don't want to set the css to:
#user-login-form{dispaly:none}

until I'm certain it will work
but for now it doesn't