Hi,
Create CodeProject like login is very difficult. But i will provide some information to create login.
Put following classes to your css file
.tooltip {
float: left;
width: 24px;
height: 24px;
margin: 0 5px 30px 5px;
border: none;
}
.member-signin.tooltip > span {
color: #005782;
font-size: 14px;
border: 1px solid transparent;
padding: 2px 21px 4px 2px;
background: url(http://s.codeproject.com/images/circle-right.png) 100% 50% no-repeat scroll padding-box transparent;
}
.member-signin.tooltip .tooltip-flyout {
margin: 17px 0 0 -140px;
z-index: 502!important;
border: solid;
border-bottom: 5px solid #F90;
padding: 10px;
.tight {
margin: 0!important;
padding: 0!important;
}
.member-signin.tooltip .tooltip-flyout .divider-dark {
display: inline;
padding: 10px 3px 4px 0;
margin: 20px 0px 13px;
}
.member-signin.tooltip .tooltip-flyout .oauth {
background-color: #F90;
color: white;
padding: 10px 3px 4px 0px;
}
Now put following code to your aspx page
<div class="float-right">
<a name="SignUp"></a>
<span class="member-signin tooltip">
<span>Sign in</span>
<div class="tooltip-flyout">
<form name="subForm" id="subForm" action="check for valid user " method="post" class="tight">
<input id="FormName" name="FormName" value="MenuBarForm" type="hidden">
<div>Email</div>
<div><input class="small-text" type="text" name="Email" id="Email"></div>
<div>Password</div>
<div><input class="small-text" type="password" name="Password" id="Password"></div>
<div class="action">
<input type="submit" value="Sign in" class="signin" onclick="return doSubmit(false);">
</div>
<div class="container">
</div>
</form>
</div>
</span></div>
This is not enough, you have to customize your div as per your need and put some code to provide better login popup to your website.
Hope this helps...
Enjoy Coding...