Question

我似乎无法让z-index在bootstrap popover上工作，如果它在div中有smooth div scroll就可以了。我已经尝试过设置极高的值，查看所有的css，看看是否有任何z-index高于popover，但没有成功。

使用Javascript：

$(".project").smoothDivScroll({
    mousewheelScrolling: "allDirections",
    hotSpotScrolling: false,
    touchScrolling: true
});
$(".block").popover({
    html: true,
    animation: true,
    placement: 'right'
});

以下是当前的展示方式：1，2。

实例：here

Answer 1

这是旧的，但对于其他人，请尝试添加以下属性：

data-container="body"

Answer 2

我认为这与你的溢出有关。它好像在削减你的盒子。如果你看一下smoothDivScroll.css中的.scrollWrapper并将overflow更改为visible，你会看到我们的盒子更多。我知道这不是你想要的效果，但我认为这是一个开始。必须与你的溢出有关。

Answer 3

您看到的剪辑可能与z-index声明无关，而是与.project div的大小和嵌套div的溢出声明相关。

div.scrollWrapper {
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
}

overflow:hidden;正在创建您正在看到的剪辑。

Answer 4

@ the mad zergling

我有an popover在页面加载时自动弹出并在一些超时后自动隐藏（在现实中它被破坏），它表示关于导航栏本身的简短指令。我也使用scrollto。

我已尝试添加

data-container="body"

没办法，行为适用于手机，取决于移动设备及其浏览器。

在黑莓OS 10上它的行为与预期一致，popover在所有内容之上，并且不需要数据容器（尽管它可能对其他设备有帮助）

在samsung / android上，默认浏览器不显示弹出框，但也有一些html5圆圈显示为正方形，所以看起来它既不支持html5，也没有完全显示下拉项目，总废品。在同一个samsung / android上，firefox要好得多，但在那里，popover被navbar标识隐藏了。没有试过chrome for android。

我希望每个特定设备上的每个移动浏览器都有自己的故事。

引导popover z-index的问题

4 个答案: