Click here to Skip to main content
15,937,012 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi frens,
I have this small task to perform. I want to implement a login portal using javascript/jquery. My code is like this.


$(document).ready(function () {
$('#dvSignIn').hover(function () {
$('#dvLoginPortal').css('display', 'block');
$('#dvLoginPortal').css('z-index', '1000');

}, function () {
$('#dvLoginPortal').css('display', 'none');
}
);
});





XML
<div id="dvSignIn" style="vertical-align: middle; text-align: right; width: 95%">
                <a style="color: white;">Sign In</a>


                <form runat="server" id="frmLoginPortal">
                    <div style="display: none; vertical-align: middle;" id="dvLoginPortal">
                        <div>
                            Username:
                            <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox>
                        </div>
                        <div>
                            Password:
                            <asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
                        </div>
                        <div>
                            <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
                        </div>
                    </div>
                </form>
            </div>




I can see this divLoginPortal but when i hover out then the div is invisible but i want to login using this div username and password. If mouse hovers over divloginportal, then i want to see this div and login through here. How can i do this please help out guys!!!!
Posted
Comments
Jameel VM 4-Sep-13 13:09pm    
remove the hover and hover out event use and use click event for showing the pop up.

1 solution

JavaScript
$(document).ready(function () {
	//On mouseenter on the 'Sign In' link, let the login portal show up.
	$('#dvSignIn').mouseenter(function () {
		$('#dvLoginPortal').show();
		$('#dvLoginPortal').css('z-index', '1000');
	});
	
	//Hide the login portal once,the mouse is out of the login portal.
	$('#dvLoginPortal').mouseleave(function(){
		$(this).hide();
	});
});
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900