如何使用CSS和或JavaScript在链接上的鼠标悬停时创建登录弹出窗口

Question

I need to create a log in popup on mouse-over on a link lust like CodeProject Sign In link works.

In my code the log in popup is not appearing on right place and mouse over is not working properly. But I want same as the code project log in popup.. How I can achieve this..

Any suggestion is appreciated..

Answer 1

When I read your question, the following came to mind: http://aext.net/2009/08/perfect-sign-in-dropdown-box-likes-twitter-with-jquery/

It "looks" similar to Code Project's solution, however behavior-wise, it does require minor modification; ie It triggers on 'click' instead of the hover/mouseover that you want.

Hopefully its somewhat useful.

Answer 2

first of all ...try this..

.loginpopup{display:none;....Your another style}
.loginpopup:hover{display:block;....Your another style}

Answer 3

I guess something like this will work, with jQuery of course.

<style>
    #popup {
        display: none;
    }
</style>

<script>
    $("#yourlink").mouseenter(function () {
        $("#popup").show();
    });
</script>

<div id="popup">Your popup</div>

<a id="yourlink" href="whatever">http...</a>