Hey guys.

i really like the login script: http://vps.net/

i like how it moves the page down and brings up a login window. Just wondering what script this is and are there any free one similar?

Best,
Nathaniel

I can ask the guys, but I know that we've done it with jquery at UK2.net's homepage in an earlier version.

:)
D

Nathaniel,

That's jQuery. That particular effect is easy to accomplish. Simply code the div like you want it w/ the proper CSS/html. Then in your css set the div to display: none; Once you've done that, add an event to your login button..say w/ a class of loginBtn. Then your jQuery would look something like this...
$(document).ready(function(){
$('.loginBtn').click(function(){
$('#loginDiv').slideDown();
});
});
you can pass in certain variables like speed in your slide down option. Hope that helps.

Hey guys.

i like how it moves the page down and brings up a login window. Just wondering what script this is and are there any free one similar?

Best,
Nathaniel

You can create that using a single DIV and a couple lines of Jquery. You'll need the Jquery UI(user-interface) plugin for the sliding effect.

If you view the source of their application.js you can see how they did it.

Using Jquery they did

$('#header .login-link a.login').click(function () {
if ($("div#login-wrap").is(":hidden")) {
$("div#login-wrap").slideDown("slow");
} else {
$("div#login-wrap").slideUp("slow");
}
return false;
});


And the HTML for that is

<div id="login-wrap" style="display: none;">
Login form stuff
</div>


The slide function will change display: none to display: block as necessary.