Bootstrap 3.2調整大小導致使用輸入字段和表單彈出廣告位置問題

Question

費用小提琴在下面。將焦點放在輸入字段中並調整瀏覽器wid的大小。當容器div重新調整大小時，彈出窗口將錯位。

http://jsfiddle.net/024pvz9d/

<div class="container"> 
     <div class="panel panel-primary"> 
     <div class="panel-heading">Labor Start</div> 
     <div class="panel-body"> 
      <form class="form-horizontal"> 
       <div class="form-group"> 
        <label class="col-sm-3 control-label" for="employee_number">Employee Number:</label> 
        <div class="col-sm-6 input-group"> 
        <input class="form-control" type="text" id="fieldModePopover" href="#" data-html="true" 
        data-content="word word word word word word word word word word word word word word word word word word word word word word word" 
        rel="popover" data-placement="right" 
        data-original-title="Title"> 
        </div> 
       </div> 
      </form> 
     </div> 
     </div> 
    </div> 

我想酥料餅留在輸入欄的右側。

這可能嗎？

Answer 1

這是一個已知的助推器「bug」，因爲這種情況下的彈出並不是真正構建的。你可以嘗試一個簡單的黑客這樣。

只是將下面的代碼添加到您的JS：

$(window).resize(function() 
{ 
    if ($(".popover").is(":visible")) 
    { 
     var popover = $(".popover"); 
     popover.addClass("noTransition"); 
     $("input:focus").popover('show'); 
     popover.removeClass("noTransition"); 
    } 
}); 

這個類你的CSS：

.noTransition { 
    -moz-transition: none !important; 
    -webkit-transition: none !important; 
    -o-transition: none !important; 
    transition: none !important; 
} 

Working Example