twitter-bootstrap 使 bootstrap popover 重叠
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14633364/
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
Make bootstrap popover overlap
提问by CodexVideos
My problem is I am using bootstrap's popover for an image, using the hover as trigger, while at the same time, I'm using the Smoothdivscroll (http://www.smoothdivscroll.com/#quickdemo) but the problem is, that part of the popover is hidden.
我的问题是我使用 bootstrap 的 popover 作为图像，使用悬停作为触发器，同时，我使用 Smoothdivscroll ( http://www.smoothdivscroll.com/#quickdemo) 但问题是，部分弹出框被隐藏。
Example https://dzwonsemrish7.cloudfront.net/items/2a3e0g0J1K0O3l3m0u2C/Screen%20Shot%202013-01-31%20at%2020.01.06.png?v=cf069cc3As you can see, part of the popover (right side) is hidden under the div. The problem is minimal in the screenshot, but when I put it on the last image you can't see it at all.
示例https://dzwonsemrish7.cloudfront.net/items/2a3e0g0J1K0O3l3m0u2C/Screen%20Shot%202013-01-31%20at%2020.01.06.png?v=cf069cc3如您所见，（右侧）是popover的一部分隐藏在 div 下。截图中的问题很小，但是当我把它放在最后一张图片上时，你根本看不到它。
I tried changing the z-index but it didn't work.
我尝试更改 z-index 但它没有用。
Popover's default code:
Popover 的默认代码：
.popover {
position: absolute;
top: 0;
left: 0;
z-index: 1010;
display: none;
width: 236px;
padding: 1px;
text-align: left;
white-space: normal;
background-color: #ffffff;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
SmoothDivScroll default code:
SmoothDivScroll 默认代码：
div.scrollWrapper {
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
}
回答by Sherbrow
Since some changes were made to the way the tooltips and popovers are included (see this commit), there has been bugs about overflowing elements.
由于对工具提示和弹出框的包含方式进行了一些更改（请参阅此提交），因此存在关于元素溢出的错误。
We could tweak your markup to make it work, with some overflow: visiblebut a fix will be available in the next version (2.3.0) as shown by this commit.
我们可以调整您的标记以使其工作，有一些overflow: visible但修复将在下一个版本（2.3.0）中可用，如本次提交所示。
Simply put, you can download the next version or apply the changes of the commit to your files to allow your popover to be used like that :
简而言之，您可以下载下一个版本或将提交的更改应用于您的文件，以允许您像这样使用弹出窗口：
$('.popover').popover({
container: 'body'
});
Or use the data attibutes : data-container="body".
或者使用数据属性：data-container="body"。
