未启用HTML垂直滚动条



我有一个垂直滚动条,显示为不可点击。垂直滚动条是可见的,但栏似乎是禁用的。

对于文本区域,我有:

<textarea id="mytextarea" rows="10" style="white-space: pre-wrap; width:99%; overflow-y:scroll; overflow-x:hidden; vertical-align:middle;"></textarea>

编辑:我发现脚本中的另一个DIV在其上有一个"位置:绝对"。当将其更改为相对时,可单击的Y-Scroll栏。想知道为什么这个位置:绝对影响滚动条?

有没有办法明确启用垂直滚动条?

垂直栏显示出来,因为您具有overflow-y: scroll;此属性专门使该栏始终可见。它看起来残疾的原因是文本区域中没有足够的内容使其可滚动。

如果添加比文本框高度的内容,则栏将是可滚动的。

这是您的代码,其中包含很多文本,您会看到它可以滚动。删除所有文本,然后将其禁用。

https://jsfiddle.net/741232T2/1/

如果您只想在可以滚动时显示栏,您想做overflow-y: auto;

下一个小提琴有overflow-y: auto;,如果您删除了所有文本,您将看到栏也消失了。

https://jsfiddle.net/741232T2/2/

我建议您使用一个单个溢出调用,而不是2:overflow: auto;。它将完成您想要的工作。

<textarea id="mytextarea" rows="10" style="white-space: pre-wrap; width:99%; overflow:auto; vertical-align:middle;">/textarea>

https://jsfiddle.net/741232T2/3/

css滚动栏上的元素是溢出:auto;

这是您的代码:

<textarea id="mytextarea" rows="10" style="white-space: pre-wrap; width:99%; overflow-y:scroll; overflow-x:hidden; vertical-align:middle;"></textarea>

使用此内容在内容溢出时自动制作元素滚动:

<textarea id="mytextarea" rows="10" style="white-space: pre-wrap; width:99%; overflow:auto; vertical-align:middle;"></textarea>

这比在元素层的不同侧两次调用溢出更有效。

最新更新