css - CSS JS（也许）Div滚动条显示和隐藏

Question

我有一个自动完成搜索，我想占据屏幕的 40%，然后滚动其余部分。

我的那部分工作正常，我的问题是滚动条总是显示，不管是否有溢出。如果仅返回 2 个结果，我希望隐藏垂直滚动。然后如果有 50 则显示。

这是我所拥有的：

HTML：

<div id="AccountSearchResultsContainer">
<div id="AccountSearchResults">

</div>
</div>

CSS：

#AccountSearchResults {
border: 2px solid #666;
margin: 0px auto;
width: 100%;
display: none;
}

#AccountSearchResultsContainer {
border-bottom: 2px solid #666;
margin: 0px auto;
width: 54%;
height: 40%;
overflow: scroll;
overflow-x: hidden;
display: none;
padding-right: 4px;
}

我是否必须编写一个脚本来确定屏幕高度 AccountSearchResultContainer 和 AccountSearchResult 的高度...如果 ASR > ASRC 然后显示滚动条，或者有没有办法用 CSS 实现这一点？

Answer 1

我认为这可以在您更改时完成

overflow: scroll;
overflow-x: hidden;

至

overflow: auto;
overflow-x: hidden;

或者干脆

overflow-y: auto;