【发布时间】:2013-12-11 01:30:37
【问题描述】:
我想实现一个基于鼠标点击位置定位的 Bootstrap Popover。 看来我需要事件来告诉我鼠标的 x 和 y 位置在哪里以及弹出框的高度和宽度才能正确计算此信息。
我目前正在做:
var pt = $.fn.popover.Constructor.prototype.show;
$.fn.popover.Constructor.prototype.show = function () {
pt.call(this);
if (this.options.callback) {
this.options.callback();
}
};
$(this).popover({
container : 'body',
html: 'true',
title: '<div id="popover-title">Title </div>',
content : '<div id="popover-body">Information </div>',
callback: function() {
// position calculation here.
}
})
但我不知道如何从回调中获取事件。
我也不太确定这是否是正确的做法。如果不是,请指出。
提前致谢。
编辑:
我这样做是为了让它工作,谢谢你的帮助。
$(this).popover({
placement: 'top',
container : 'body',
html: 'true',
title: '<div id="popover-title">Title </div>',
content : '<div id="popover-body">Information </div>',
trigger: 'manual'
}).click(function (e) {
var popover = $("#popover-title");
$(this).popover((popover.length != 0)? 'hide' : 'show');
popover = $("#popover-title");
if (popover && popover.parent() && popover.parent().parent()) {
popover = popover.parent().parent();
}
var left = e.pageX;
var top = e.pageY;
var height = popover.height();
var width = popover.width();
popover.css({
top: top - height,
left: left - width / 2 + 'px'
});
});
【问题讨论】:
标签: javascript jquery css twitter-bootstrap