css - Fullcalendar 与 bootstrap popover z-Index 问题

Question

我正在尝试集成完整的日历调度程序和 Bootstrap 弹出窗口。但是，我遇到了 UI 问题。

我尝试为 popover 以及我的 popover 内部 html 设置 z-index。什么都没用。

这是我的 fiddle 链接 https://jsfiddle.net/87977p1x/5/

点击事件 2 可以看到弹窗。这是 fullcalander 中的 popover 代码

eventRender: function (event, element) {

                    element.popover({
                        trigger: "click",

                        title: '<div class="label label-lg label-primary col-xs-12">' + event.title + '</div>',
                        html: true,
                        content: '<div style="width:70px">My content goes here.. blahhh blahhhh<div><div> Some more content in this div having more nested HTML</div>',
                        template: '<div class="popover" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'

                    });
                }

在过去的 3 天里尝试了很多都无法找出为什么它落后于事件，即使我增加了 z-index..

Answer 1

基于另一个问题Fullcalendar with Twitter Bootstrap Popover ，我应用了 container:'body' 它有效..

 element.popover({
                    trigger: "click",
                    container:'body',
                    // other settings...

                });

Working JSFiddle