Bootstrap Popover出现在与其触发器不同的元素上

Question

我希望弹出窗口出现在另一个元素而不是触发器上。目前我有：

 $triggerElement.popover({
                title: varTitle,
                content: varContent,
                html: true,
                placement: 'auto top',
                trigger: 'manual'
            });
..........
<div class="shopper"></div> 

<button type="button" class="btn btn-primary">Add</button>

当前，弹出窗口正确触发（按钮单击事件），并且位于页面底部。但是，我希望将位置设置为div“购物者”（div的底部）右上角的元素。选择器有可能实现此功能吗，或者您可以通过CSS帮助我吗？

该按钮会触发当前在按钮上方绘制的弹出框。但是我想将弹出框绘制在购物者div标签的正下方。因此，购物者div标签将成为代理触发器。

Answer 1

如果我了解您想要的内容，则需要像这样手动显示/隐藏弹出窗口。

$('.shopper').popover({
  title: "varTitle",
  content: "varContent",
  html: true,
  placement: 'bottom',
  trigger: 'manual'
});

$('#trigger').click(function(){
  $('.shopper').popover('toggle');
});

演示：http：//www.bootply.com/7oM1aoycIi