Twitter bootstrapモーダルがフォームの前に開いています
Twitterに問題がありますbootstrapモーダル：フォームの前で開きます。3日前に非常にうまく機能していたので、何をしたのかわかりません。 。フォームに書き込むことができます。フォームは機能していると思います。問題は、フォームの前にあるモーダル開口部です。
.modal-backdropクラスのz-indexは1040に設定され、navbar-fixed-topのz-indexは1030に設定されています。したがって、背景がフォーム上に表示されます。
CSSファイルの.modal-backdrop z-index値を、navbarz-indexよりも小さい値に設定してオーバーライドします。これで問題が解決します。
同様の問題がありました。私はここでそれらに対処しました： http://jsfiddle.net/ATeaH/8/
ニールセンが私のために働いた上記の簡単な解決策...
divを持っていました。モーダルをinside navbarにアタッチしました。 divをナビゲーションバーの外に移動しました-<body>のすぐ下に移動しました
問題が解決しました！
モーダルがAJAXを介してDOMに挿入されているという同様の問題が発生しました。ページを更新しないと、モーダルはマスクの後ろに残り、アクセスできませんでした。
興味深いことに、モーダルはページの更新で正常に機能しました。 HTMLの場合と同じ場所にモーダルをAJAXで挿入していましたが、AJAXでは機能しませんでした。修正はモーダルの部分を本体に追加することでした。次のとおりでした：
$('body').append(....j render partial....);
出くわした他の提案のいくつかを試しましたが（z-indexを微調整するなど）、私の場合は役に立ちませんでした。
この解決策を試してみてください、それは私のために働きました：
$('#myModal').appendTo("body").modal('show');
私はAngularJSを使用していますが、同じ問題が発生しました。明確にするために、私のモーダルはAngular実行時にng-viewを介してDOMに挿入する別のHTMLファイルにありました。この問題の原因は、cssアニメーションクラスがあったことです。私のng-viewがあったdiv。例として：
<div ng-app="myApp">
<div class="pageTransition" ng-view></div> <!-- problem: class="pageTransition"-->
</div>
Cssクラスを削除すると問題が修正され、モーダルが通常の動作順序に復元されました。これを回避する解決策は、標準クラスをAngularの ng-class に置き換えることです。このようにして、モーダルの使用中にクラスを動的に追加、変更、または削除できます。
SASSを使用している場合は、内部で次のことを実行できます_ modals.scss：
.modal-dialog {
position: relative;
z-index: $zindex-modal-background; // copy-pasted z-index from .modal-backdrop
width: auto;
margin: 10px;
}
以下をCSSに追加します
.modal-dialog {
z-index: 1050;
}
私はこれと同じ問題を抱えていました。私の場合、それは私のヘッダーの閉じられていないdivが原因でした。