so habe ich Bootstrap basierte Website mit festen Navigationsleiste (die folgen Sie auf der Seite an der Spitze) und wenn ich Modal Popup anzeigen möchte, erscheint es hinter dieser Navigationsleiste, wie zu beheben?modal erscheinen hinter festen navbar
und i mit margo template from graygrids
es auch in summernote modals erscheint Bild für das Hochladen, so sieht es aus wie alle modale hinter der Navigationsleiste angezeigt.
Die navbar fixiert ist, z-index Bedeutung ist nur relativ zu dieser Kinder ist. Die einfache Lösung besteht darin, einfach den oberen Rand des äußeren modalen Containers zu vergrößern, um ihn leicht von der Navigationsleiste nach unten zu drücken.
Andernfalls muss Ihre modale Markup in Ihrer Kopfzeile sitzen und Sie müssen einen höheren Z-Index als der Z-Index der übergeordneten Navigationsleiste geben.
Sie müssen den Z-Index in Ihrem CSS anpassen. Der Z-Index für Ihre Navigation ist höher als alles andere. Um es anzupassen, müssen Sie einen Z-Index hinzufügen, der für Ihr modales Popup höher ist. der Code würde aussehen wie
Zum Beispiel Z-Index: 3;
Um dies tun zu können, müssen Sie eine Position in Ihrem Popup setzen.
Zum Beispiel Position: absolut;
Nach der Position Einstellung können Sie auch die Position mehr einstellen, auch mit diesem Code setzen sich in Ihrem CSS
top: 500px; links: 500px;
Dies bedeutet, dass der Container, auf den Sie eine absolute Position setzen, 500 Pixel von oben und 500 Pixel von links verschoben wird.
Wenn Sie nicht verstehen können, was Z-Index ist. Ich werde ein Bild für Sie bereitstellen.
hmm danke, ich werde versuchen, es zu verstehen ahahhaa so z-index ist eine Art wie Layer-Position in Photoshop etc ... hahaha –
z-Index ist in HTML. Hier werde ich Ihnen eine wirklich gute Ressource geben. Der Link erklärt den Z-Index und zeigt gute Beispiele. http://www.w3schools.com/cssref/pr_pos_z-index.asp – Plam
Z-Index funktioniert in diesem Fall nicht – Sventies
das Problem zu lösen ich einen super hohen z-index Wert im CSS enthalten (1000000) für den modal-Hintergrund (der Schatten hinter dem modal), und ein wenig höher eine (1000001) für die modal:
.modal-backdrop {
z-index: 100000 !important;
}
.modal {
z-index: 100001 !important;
}
Hoffe es hilft!
wow danke ich habe nie daran gedacht, es ist so einfach wie das Herunterdrücken dieser gestapelten Element ahahhahaa ..... –
Froh, dass es geholfen hat! Bitte schön. – Korgrue