我面临着PopOver的问题。我希望它在所有位置都自动调整。如果在右侧找不到空间,则会在左侧打开。但我希望它对顶部/底部执行相同的操作。即,如果在顶部找不到空间,则应在底部打开,反之亦然。我有没有办法全方位地做到这一点?

$('[data-toggle="popover"]').popover({
        trigger: 'manual',
        placement: 'auto right'
    })


HTML

<a data-toggle="popover" class="hlpicon" data-html="true" data-trigger="hover" data-container="body" data-content="This will open a popover" data-original-title="" title=""></a>

最佳答案

您应该能够将placement选项用作字符串或返回字符串的函数:

$('[data-toggle="popover"]').popover({
    trigger: 'manual',
    placement: function (context, source) {
        var position = $(source).position();

        if (position.left > 515) {
            return "left";
        }

        if (position.left < 515) {
            return "right";
        }

        if (position.top < 110){
            return "bottom";
        }

        return "top";
    }
});


对于上下文,此代码的来源是Changing the position of Bootstrap popovers based on the popover's X position in relation to window edge?(声明不需要属性-只需将其添加为资源即可)。

10-06 00:29