Today I bring you an animated jQuery login and registration form that I’ve been experimenting and working on.
The main idea is to have one form, that can be used to register and to login as well. And since the registration requires an email address in most cases, but not the login ( I know you could make it so they can use email to login, but that’s not the point now ) I’ve decided to create a sort of tab system and add and remove the email field with jQuery.
[button-red url=”http://webdesignerhut.com/examples/jQuery-Login-and-Registration-Form/” target=”blank” position=”left”]Live Demo[/button-red] [button-green url=”http://webdesignerhut.com/wp-content/uploads/2015/07/jQuery-Login-and-Registration-Form.zip” target=”blank” position=”left”]Download[/button-green]
First I’ve used the show/hide jQuery functions, but the problem with that was, that when it was hidden, the HTML for the email field was still there, but hidden for the user. So I decided to use the appendTo() and remove() functions.
You can see the animation how the field appears and disappears on the live demo page. Also note that this is only an HTML/CSS and jQuery form.
You’re free to use this form any way you want. Altho if you use it on some projects or something, a little credit is always appreciated.
I hope you like this small animated jQuery login and registration form. Feel free to share it with your friends and leave your opinion about it below!