修改

Question

我正在使用Bootstrap 3.3.1 popovers为Composite C1构建动态菜单系统。动态内容工作正常，但我似乎无法正确调整弹出宽度。

我可以使用.popover-menu-markup .popover{ width: whatever}设置绝对大小，但我希望宽度基于内容。如果我设置width: auto，则弹出窗口基于popover-title，而不是popover-content。

有什么想法吗？

修改

抱歉，JSFiddle在这里：http://jsfiddle.net/rebeccamarye/x075bm6x/2/

该示例显示了一个段落作为内容，但在实际页面中有一堆带有{display：inline-block}的div，但我认为这显示了问题... popover需要扩展略小于页面的宽度。

Answer 1

更新：

http://jsfiddle.net/x075bm6x/7/

<强> JQ

$('.popover-markup>.trigger').on('shown.bs.popover',function(e){
    var $link =$(this);

    var winW=$(window).width();    
    var poL=$link.offset().left+$link.width();        
    var newW=winW-poL-60;        

    var poId=$link.attr('aria-describedby');
    var $po=$('#'+poId);

    console.log(poId+': '+winW+' L: '+poL+' > '+newW);

    //$po.width(newW);
    $po.find('.popover-content').width(newW)
});

<强> CSS：

.popover{width:auto!important; max-width: none}

Bootstrap popover动态大小

修改

1 个答案: