Question

在以下示例中，是否有任何方法可以使.bar和.foo以及.plaa范围内的.baz弹出：

HTML：

<div class="plaa">
    <div class="foo">
        FOO
        <div class="bar">
            BAR
        </div> 
    </div>
</div>
<div class="baz">
    BAZ
</div>

CSS：

.bar{
    display:none;
    width:420px;
    height:420px;
    background-color:pink;
    z-index:420;
    position:absolute;
    overflow:auto;

}
.foo{
    width:50px;
    height:50px;
    background-color:orange;
    cursor:pointer;
    position:relative;

}
.baz{
    position:absolute;
    top:55px;
    background-color:yellow;
}
.plaa{
    position:absolute;
    overflow:auto;
    max-width:50px;
    max-height:50px;
}

JS：

$(".foo").click(function(){$(".bar").toggle()});

当我从overflow:auto;移除.plaa时，它可以正常工作，但不幸的是，在我的真实案例中，我无法做到这一点。

Answer 1

进行这些更改

.plaa{
position:absolute;
max-width:50px;
max-height:50px;

}

$(".foo").click(function(){$(".bar").toggle(function(){$(".bar").css({"overflow":"visible"});})});

我希望这就是你想要的。

Answer 2

如果你真的不能在现实世界的情况下这样做，那么使用javascript操作DOM。

使div元素弹出它的父有溢出：auto

2 个答案: