Bootstrap modal se noirci à cause de la barre de navigation positionnée
Quand mon Bootstrap modal est montré, on dirait qu'il y a derrière ce fond noir. En cliquant n'importe où sur l'écran provoque la modale de s'en aller.
Le problème semble être provoqué par le positionnement de ma navbar - retrait position: absolute;
ou position: relative;
il fixe. Malheureusement, depuis que j'ai besoin d'utiliser le z-index sur la barre de navigation, je ne peux pas vous débarrasser de ce positionnement.
Pourquoi la barre de navigation, le positionnement d'origine du modal être masqués? Est-il un moyen de faire de l'modale apparaît devant la toile de fond tout en gardant le positionnement sur la barre de navigation?
source d'informationauteur yndolok
Vous devez vous connecter pour publier un commentaire.
C'est parce que votre modal est à l'intérieur de votre
#nav_inner
<div>
donc il va hériter d'un style que vous ne voulez pas à.Il n'a pas besoin d'être là.
Essayez de le déplacer dans le corps comme ci-dessous:
Mise à JOUR:
C'est l'une de ces questions-là, je savais que la modification de la position de l'élément dans le DOM serait-il fixer, mais la compréhension de la cause est un autre problème entièrement.
Retrait
position: relative; z-index: 2;
de deux#navbar
et#nav_inner
résout également le problème, donc, même si le modal aposition: fixed; z-index: 1050;
où z-index ne fonctionne qu'avec une position et une position fixe met l'élément positionné par rapport à la fenêtre du navigateur, ce n'était toujours pas de travail en raison de l'élément parent ayant une position relative et les z-index... magique.La raison, le délavé de fond est apparu au-dessus est parce que ce est ajouté au corps à l'aide de javascript, donc il n'avait aucun problème avec l'application de la corriger z-index de 1040, et a été placé au-dessus de la modale.
J'ai eu le même problème. Mais comme mon contenu a été chargé en ajax, j'ai été incapable de créer des "modal" avant de fermer
J'ai donc fait ceci:
Et maintenant le "modal" fonctionne comme prévu.