使用小Bootstrap模式的超大背景模態

我遇到了Bootstrap模式的問題，如果我將大小更改爲小，背後仍有一個揮之不去的背景模態，它仍然很大。使用小Bootstrap模式的超大背景模態

在元素窗口，我可以刪除類=「模式內容」 UIB模態，transclude和模態消失背後的權利之前。不過，我正嘗試在我的代碼中應用此更改，並且無法使其正常工作。

首先，這代碼似乎我使用ui_bootstrap/1.1.2

從uib/template/modal/window.html或https://github.com/angular-ui/bootstrap/blob/master/template/modal/window.html

來我試圖覆蓋使用windowtemplateurl模板，使新的模板有：

<div modal-render="true" tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in" 
    uib-modal-animation-class="fade" modal-in-class="in" ng-style="{'z-index': 1050 + index*10, display: 'block'}" 
    uib-modal-window="modal-window" size="sm" index="0" animate="animate" modal-animation="true" 
    style="z-index: 1050; display: block;"> 
     <div uib-modal-transclude=""><!-- 

      <!-- Modal --> 
      <div class="modal-dialog modal-sm"> 
       <div class="modal-content modal-sm"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal" ng-click="Cancel()"><span 
           aria-hidden="true">×</span> 
          <span class="sr-only">Close</span> 
         </button> 
         <h4 class="modal-title ng-binding" id="notfound"> Not Found</h4> 
        </div> 
        <div class="modal-body"> 
         <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="Cancel()">Close 
         </button> 
         <button type="button" class="btn btn-primary">Add New</button> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

這沒有奏效。它似乎沒有改變windowTemplateUrl改變任何東西...我也嘗試添加CSS到模態內容，但是這在這個頁面上釘住了其他模態。

我在正確的軌道上嗎？這個錯誤來自哪裏？解決問題的最佳方法是什麼？

來源

2016-05-09 jenryb

儘管您在模態對話框中使用了「modal-xl」類。將其更改爲「modal-sm」。 –

@RachelS是的，我也看到了，但又是在window.html代碼中，並且我的覆蓋不起作用。 – jenryb

@RachelS我把modal-xl改成了modal-sm以及size =「sm」，在它的背後還有一個模態，儘管它比較小。周圍的模態是300x184，而我的模態是300x122 – jenryb

如果有其他人有這個錯誤，這是我所做的修復它。

我的代碼中找到了模態大小爲「xl」的聲明。將其更改爲「sm」，並且圍繞我的模式仍爲300x184，而我的模式爲300x122。

我拿出class="modal-dialog" div包裝，第二個模態消失了。

來源

2016-05-09 17:21:00 jenryb

使用小Bootstrap模式的超大背景模態

回答

相關問題