モーダルが表示されているときにドロップダウンを表示しない

Question

モーダルウィンドウに小さな問題があり、何らかの理由でこれを理解できません。 携帯ではハンバーガーメニューを持っており、そのメニューにはモーダルウィンドウを開く[ログイン]リンクがあります。 すべて動作し、モーダルが表示されていますが、問題は次のとおりです。ドロップダウンメニューがモーダルの上に表示されています。

私が使用してそれを隠そうとした：私は

$(document).ready(function() { 

    var modal = $('.modal'); //get modal window 

    if(modal.hasClass("in")){ //check if it has class "in" 
    $('.navbar-toggleable-md').hide(); //true, hide navbar 
    } 

}); // end ready 

何をしないのですか？上のコードは何もしていないからです。

Answer 1

show.bs.modalまたはshown.bs.modalを.modalに設定する必要があります。

$(document).ready(function() { 
    $('.modal').on('shown.bs.modal', function (e) { 
     $('.navbar-toggleable-md').hide(); 
}); 
}); 

読むブートストラップドキュメント：ドロップダウンのz-indexより大きいあなたのモーダルのz-indexを設定modals-events

Answer 2

私たちのモデルにはz-indexに問題があると思います。あなたのモーダルのZ-インデックスを増やしてください。 または、ご自分のコードを聞いてください。

Answer 3

このような何か。 例：

.modal { 
    z-index: 999; 
} 
.dropdown { 
    z-index: 99; 
}