我正在尝试弄清楚如何为一个孩子的父孩子隐藏溢出,但不为另一个孩子隐藏溢出。我正在为 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 */
}
我尝试让孩子更加分开,但这会妨碍拖放。
您可以仅为第二个规则指定
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>