根据子级为父级分配不同的溢出行为

问题描述 投票:0回答:1

我正在尝试弄清楚如何为一个孩子的父孩子隐藏溢出,但不为另一个孩子隐藏溢出。我正在为 Fivem 制作库存,所以我希望可以滚动浏览插槽,但这样会使插槽中的项目无法从父级中拖出?

它是用 jquery 编码的。问题是这些项目被分配到插槽中,所以我无法将它们分开。

示例代码:

/* This is the parent */
.parent {
    height: 500px;
    width: 600px;
}

/* This child should be assigned to none overflow so i can scroll through it */
.first-child {
    /* CSS */
}

/* This child should be able to go over the overflow */
.second-child {
    /* CSS */
}

我尝试让孩子更加分开,但这会妨碍拖放。

jquery css drag-and-drop overflow
1个回答
0
投票

您可以仅为第二个规则指定

overflow-y: scroll;
规则,如下所示:

/* This is the parent */
.parent {
    height: 500px;
    width: 600px;
    background-color: black;
    display: flex;
}

/* This child should be assigned to none overflow so i can scroll through it */
.first-child {
    height: 100%;
    width: 30%;
    background-color: red;
}

/* This child should be able to go over the overflow */
.second-child {
    height: 100%;
    width: 70%;
    background-color: green;
    overflow-y: scroll;
}
<div class="parent">
    <div class="first-child"><div style="width: 1px; height: 2000px;"></div></div>
    <div class="second-child"><div style="width: 1px; height: 2000px;"></div></div>
</div>

最新问题
© www.soinside.com 2019 - 2025. All rights reserved.