Thursday, March 7, 2013

Simple Popup Login Form Using jQuery and CSS

Popup Login Forms can be seen on almost every website these days. They look good, but do you know how to make them? Don't worry, today in this tutorial we will learn How to make a Simple Popup Login Form using simple Jquery and CSS. This is the Simplest tutorial for Popup Login Form on Internet.
Popup Login Form using jquery and CSS
The Download Script only has two files, one is index.html and other one is stylesheet wtfdiary.css, you can very easily customize both these files as per your requirements.



Popup Login Form using jquery and CSS

Following is the small JavaScript code that we used to accomplish this simple and amazing Popup Login Form.

  JavaScript  


$(document).ready(function(){
  $("#login_appear").click(function(){
    $("#shadow").fadeIn("normal");
    $("#loginform").fadeIn("normal");
    $("#uname").focus();
   });
  $("#login_hide").click(function(){
    $("#loginform").fadeOut("normal");
    $("#shadow").fadeOut();
   });
  $("#login").click(function(){
     alert("This is the Login Button");
   });
});


You can use this to create your own Ajax Forms, or Registration Forms for your website. For any Problem do feel free to comment. And we will very soon update this Script into Ajax Login Form System. So Stay tuned :)


1 comment :

  1. How do I validate the username and password from mysql to grant the user access or redirect the user to a different page

    ReplyDelete