Login Popup on Mouseover
<p>I am trying to create a popup login screen.  It should appear when the user hovers over a hyperlink and dissapear if the mouse moves out of the popup.<br>
The code I have below works but unfortunately the popup incorrectly closes if the mouse moves over another element inside the popup such as the username and password textboxes.
Any ideas how I can fix this flaw?   </p>

<pre><code>&lt;script type="text/javascript" language="javascript"&gt;

        function showDiv(display) {
            if (display) { document.getElementById('hoverLoginBox').style.display = 'block'; }
            else { document.getElementById('hoverLoginBox').style.display = 'none'; }
        }
&lt;/script&gt;

&lt;asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/register.aspx" CssClass="hyperlink"
        onmouseover="showDiv(true);"&gt;login&lt;/asp:HyperLink&gt;
&lt;div id="hoverLoginBox" onmouseout="showDiv(false);"&gt;
        &lt;asp:Login ID="Login3" runat="server" CssClass="loginBox" CreateUserText="Create a new  Client Account"
            CreateUserUrl="~/contact-us.aspx" PasswordRecoveryText="Forgotten Your Password?"
            TitleText="" PasswordRecoveryUrl="~/password-recovery.aspx" LoginButtonType="Image"
            FailureText="Invalid Username / Password." DestinationPageUrl="~/membership/user-profile.aspx"
            FailureAction="RedirectToLoginPage"&gt;
            &lt;LayoutTemplate&gt;
                &lt;asp:TextBox ID="UserName" runat="server" CssClass="textbox"&gt;username&lt;/asp:TextBox&gt;
                &lt;asp:TextBox ID="Password" runat="server" CssClass="textbox"&gt;password&lt;/asp:TextBox&gt;                  
                &lt;asp:Button ID="Button1" runat="server" CssClass="hoverLoginButton" Text="Login" /&gt;
            &lt;/LayoutTemplate&gt;
        &lt;/asp:Login&gt;
        &lt;div class="loginLinks"&gt;
            &lt;asp:HyperLink ID="CreateUserLink" runat="server" NavigateUrl="~/register.aspx" CssClass="hyperlink"&gt;Create Account&lt;/asp:HyperLink&gt;&amp;nbsp;&amp;nbsp;|&amp;nbsp;&amp;nbsp;
            &lt;asp:HyperLink ID="PasswordRecoveryLink" runat="server" NavigateUrl="~/password-recovery.aspx"
                CssClass="hyperlink"&gt;Forgotten Your Password?&lt;/asp:HyperLink&gt;
   &lt;/div&gt;
&lt;/div&gt;
</code></pre>
