使用fullcalendar在内容窗口上保持popover打开

时间:2016-04-27 20:24:33

标签: javascript jquery css twitter-bootstrap fullcalendar

我试图弄清楚当你从事件块悬停到弹出窗口内容窗口时如何在悬停时保持fullcalendar popover打开。

http://jsfiddle.net/rjayako/7zoqgroj/

目前,当您将鼠标悬停在事件块上时,会出现弹出窗口,但当您将鼠标悬停在其他位置时会立即消失。我想要实现的是当您将鼠标悬停在弹出框上时仍然显示该框,以便用户可以单击弹出框中的链接。

这是我的eventRender到目前为止看起来像什么

  eventRender: function(event, element) {
    element.popover({
      title: "My Title",
      placement: 'bottom',
      html: true,
      content: event.msg,
      trigger: "hover"
    });
  },

任何帮助都将深表感谢。

问候。

1 个答案:

答案 0 :(得分:0)

这是你的answer。禁用动画并使弹出窗口手动触发。 JSfiddle

animation:false 
trigger: "manual"

这是完整的eventRender:

eventRender: function (event, element) {
                    element.popover({
                    title: "My Title",
                    placement: 'bottom',
                    html: true,
                    animation:false,
                    content: event.msg,
                    trigger: "manual"
                        }).on("mouseenter", function () {
                            var _this = this;
                            $(this).popover("show");
                            $(".popover").on("mouseleave", function () {
                                $(_this).popover('hide');
                            });
                        }).on("mouseleave", function () {
                            var _this = this;
                            setTimeout(function () {
                                if (!$(".popover:hover").length) {
                                    $(_this).popover("hide");
                                }
                            }, 300);
                        });
                      }