show the form and fill the form when the mouse hover on the toplink div

[runeveryday]

the mouse will hover on block html:

<div class="toplinks">...</div>

the show block content html:

<div id="pop-login" style:"display:none;">...some content and a form</div>

my jquery code:

$('.toplinks').hover(function(){

    $('#pop-login').toggle();
    $('#pop-login').toggleClass("hpposition");
});

the css:

.hpposition{
    position: absolute;
    top: 30px;
    left:500px;
    z-index: 10000;
}

now, there comes a problem, when the mouse move out the toplinksdiv. i can't fill something to the showing form. when the mouse moves out the toplinks div. the form disappear immediately. how to make that the use can fill some content to the form?

http://miranda.gomoxy.net/test.jpg

although i have set the

.hpposition z-index: 10000;.

but there are some content still above the showing form layer.

[MarPlo]

Hi
Try with this jQuery cvode, and use z-index:9990;

$('.toplinks').hover(function(){
    $('#pop-login').show();
    $('#pop-login').addClass("hpposition");
});

[runeveryday]

Hi
Try with this jQuery cvode, and use z-index:9990;

$('.toplinks').hover(function(){
    $('#pop-login').show();
    $('#pop-login').addClass("hpposition");
});

but i want when i completed to fill out the form the block can hide.thank you

[MarPlo]

Hi,
Just add a button in that form, and jQuery code that hide() the form when click on the button.

$('#id_button').click(function(){
    $('#pop-login').hide();
});

[runeveryday]

Hi,
Just add a button in that form, and jQuery code that hide() the form when click on the button.

$('#id_button').click(function(){
    $('#pop-login').hide();
});

it still can't work. put you mouse on the

My Account part,which on the right top of the page. thank you

http://miranda.gomoxy.net/