Twitter引導模式在表格前打開

總結此解決方案，請添加：$（'。modal）.appendTo（'body'）;到你的腳本。這會將.modal（無論在何處定義）移動到.modal-backdrop由bootstrap自動生成的位置，從而製作2個元素的「兄弟」，這可以糾正z-index問題 – rmirabelle 2014-02-01 20:31:41

一個簡單的解決方案，尼爾森提到上述這工作對我來說...

我有div我附上我的模式，以內導航欄。我將div移到了導航欄之外 - 剛好在<body>

問題解決了！

來源

2012-12-11 09:36:05 jasop

我遇到了類似的問題，通過AJAX將模式插入到DOM中。沒有頁面刷新，模態仍然在掩碼後面，無法訪問。

有趣的是，模式工作正常，刷新頁面。儘管我使用AJAX將模式插入到與AJAX相同的位置，但它不適用於AJAX。我的修復是將模態部分附加到身體上。所以我的代碼爲以下幾點：

$('body').append(....j render partial....);

我嘗試一些我遇到了其他的建議（如調整的z-index），但並沒有在我的情況有所幫助。

來源

2013-09-11 00:50:05 bigtex777

我有這個相同的問題。在我的情況下，這是由於我的標題中有一個未公開的div。

來源

2014-02-20 12:33:03

嘗試這種解決方案，它爲我工作：

$('#myModal').appendTo("body").modal('show');

來源

2014-04-18 10:39:57

我與AngularJS工作，遇到同樣的問題。爲了澄清，我的模態是在運行時通過ng-view Angular注入DOM的另一個HTML文件。導致這個問題的原因是我在我的ng-view所在的div上有一個css動畫類。舉個例子：

<div ng-app="myApp"> 
    <div class="pageTransition" ng-view></div> <!-- problem: class="pageTransition"--> 
</div>

刪除的CSS類固定的問題，並恢復了我的情態，以正常工作秩序。解決這個問題的方法是用Angular的ng-class替換標準類。這樣，您可以在使用模式時動態添加，修改或刪除類。

來源

2014-09-18 17:10:39 ejborges

以下添加到您的CSS

.modal-dialog { 
    z-index: 1050; 
}

來源

2015-02-10 10:23:52

如果您使用SASS你可以做內部_modals以下。scss：

.modal-dialog { 
    position: relative; 
    z-index: $zindex-modal-background; // copy-pasted z-index from .modal-backdrop 
    width: auto; 
    margin: 10px; 
}

來源

2016-07-18 03:43:31 adamj

Twitter引導模式在表格前打開

回答

相關問題