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

Question

也许我正在处理这个错误，但我有一个表格，其中部分内容临时被删除......

.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 中。