twitter-bootstrap 如何仅在需要时显示 Bootstrap 3 弹出滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21456772/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show Bootstrap 3 popover scroll only when needed
提问by Valentino S.
I have this popover, with a scroll bar
我有这个弹出框，带有滚动条
HTML
HTML
<ul class="navbar-nav pull-right">
<li><a href="#" data-toggle="popover" title="Notifications" data-html="true" data-content="<a href='?Profile'><div class='pop-text'>Notification 1</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 2</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 3</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 4</div></a><hr /><div><p id='foot-notification-pop'><a href='?notification'>Show all</a></p></div>">Notification</a></li>
</ul>
CSS
CSS
.popover-content {
height: 200px;
overflow-y: scroll;
}
I want to show the scroll bar only when needed, that is only when the height of the popover-content go over the height of 200px. At the time the scroll bar is always displayed, but is not clickable (of course) when the height is less than 200px. How can i do it? Any help would be greatly appreciated. Thanks!
我只想在需要时显示滚动条，也就是当 popover-content 的高度超过 200px 的高度时。当时滚动条始终显示，但高度小于200px时不可点击（当然）。我该怎么做？任何帮助将不胜感激。谢谢！
回答by
You can use overflow:auto. Read more about overflow propertyhere
您可以使用overflow:auto. 在此处阅读有关溢出属性的更多信息
回答by winnyboy5
Set overflow-y to auto. This will show the scroll only when the content crosses 200px height.
将溢出-y 设置为自动。仅当内容超过 200 像素高度时才会显示滚动。
"overflow-y: auto;"
This should work.
这应该有效。
回答by Sairam Venkata
After opening the popover, write a settimeout and calucate the height of the popover by css.
打开popover后，写一个settimeout，用css计算popover的高度。
If height is more than required, add
如果高度超过要求，添加
$("popover-content").css("max-height", "200px");
$("popover-content").css("overflow-y", "auto");
This will help :)
这将有所帮助:)
