悬停时使用jQuery显示时如何重叠块元素

Question

也许我做错了，但我有一个表格，其中部分内容 temp 已删除...

.form_jquery {display: none;}

当父 div 和标题悬停时，我正在显示内容...

$(document).ready( function () {
        $(".deliver").hover(
            function () {
            $(".form_jquery").css({'display':'block'});
            },
                function () {
                    $(".form_jquery").css({'display':'none'});
                }
         )
    });

问题是，我在此表单标题/切换下有一个“主要内容”区域，当我们...

css({'display':'block'})

下面的块元素被向下推。我在下部块上尝试了一些显示元素选项，但有不良反应。我最后的手段是将我的表单设置为“固定”，但我确实希望它模拟菜单标题并与该组一起滚动。

http://www.testinr.com/

Answer 1

您应该将以下项目添加到您的 css 中

.deliverOnHover
{
    position:relative;
    z-index: 99;
    display: block;
}
body{
    position: absolute;
    table-layout:fixed;
}

而 Jquery 会是这样的：

$(document).ready( function () {
    $(".deliver").hover(function(){
         $(".form_jquery").toggleClass('deliverOnHover');
    });
});

并将position:absolute添加到下面div的css中。