Question

我有一个div从height: 0动画到height: 80%（身体的80％），有时这个出现的div中的内容会比div大，需要滚动条。

问题是当动画运行时滚动条不显示，并且仅在动画之后需要时才显示。（真是个好事）

但我很挑剔，因为我正在为我的网站添加最后的润色，当滚动条随机出现时，它会将内容向左移动，看起来很有趣。

所以我希望滚动条始终存在，无论如何。这可能吗？

Answer 1

要始终显示垂直滚动条，您可以使用

#yourDivId {
  overflow-y: scroll;
}

如果您所包含的内容的高度小于#yourDivId，则垂直滚动条似乎已停用。

如果它的高度更大，则垂直滚动条会启用。

Answer 2

您的动画库必须在外部元素上设置overflow: hidden，这就是滚动条消失的原因。

尝试将内容包装在另一个div中：

<!-- the outer element; pass this one to the animation lib -->
<div>
    <!-- the scroll bar will appear on this element -->
    <div style="overflow: scroll; height: 100%">
        <!-- content here -->
    </div>
</div>

在此处试试：http://jsfiddle.net/e3BkK/

Answer 3

通过CSS将overflow: scroll添加到body元素：http://jsfiddle.net/GMcdf/1/。

body {
    overflow: scroll;
}

在动画上强制垂直滚动条

3 个答案: