CSS z-index funktioniert nicht richtig

Bin ich mit z-index auf meiner Seite (link nicht mehr benötigt wird- ), und es funktioniert nicht richtig: es bedeutet nicht, bestimmte divs über alle anderen...

Können Sie sehen es selbst, indem Sie eines der Objekte in der linken oder rechten Leiste.
Dann wird die Maske fade-in, aber die message-box, darunter.
Ich habe schon viel probiert, aber ich bekomme einfach nicht die message-box zu zeigen, die über alle anderen...

Was kann ich tun um dies zu beheben? [Anmerkung: die 2. Frage unten!]

Wenn Sie nicht wollen, um zu überprüfen, die Seite, die message-box befindet sich in einigen anderen divs:

<div>
 <div>
  <div>message box</div>
 </div>
</div>

Die CSS-Positionierung ist wie folgt:

.window {
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 100;
}

Verwende ich position:fixed, wegen position:absolute ist nicht die absolute hier, die div ist nicht ausgerichtet, um den Körper, sondern etwas anderes irgendwie.
Gibt es eine Möglichkeit zum zurücksetzen der Positionierung über absolute position wieder?

z-index funktioniert nur, wenn es verwendet wird, um Elemente, die die gleiche Art der Positionierung. Also, wenn ein element aus dem dom über absolute oder eine andere position, dann wird dessen z-index wird nicht relativ zu anderen Elementen im dom-aber nur, um Elemente, die die gleiche Positionierung geben.
Oh ok, also ein festes Objekt kann einfach nicht überlagern und ein absolutes Objekt?
korrekt, weil nach dem z-index und der dom sind Sie wirklich nicht zueinander und in der Tat, weil eine absolute Objekt aus der dom-die Feste muss man nicht einmal weiß, Ihr dorthin zu gehen.
Ok. Vielen Dank dafür! Ich dachte schon, machst einen workaround mit jQuery: die Inhalte von was ist jetzt die message-box. Und platzieren, dass im inneren ein weiteres div-Element, das absolut positioniert ist. Ich denke, dass es funktionieren wird.
ja ich habe laufen in die z-index-Probleme, bevor Sie mit Elementen, die verschiedene Arten von Positionen. Position definitiv ankommt und es ist wirklich ärgerlich 🙁

InformationsquelleAutor laarsk | 2011-11-28

  1. 18

    Solange ich mich erinnern kann, z-index Probleme kommen Häufig aus der Tatsache, als die Eltern des z-indizierte Elemente sind nicht positioniert. Geschwister Eltern positioniert werden soll.

    InformationsquelleAutor Boris Delormas

  2. 2

    Wenn Sie mit jquery prüfen Sie die top-Z Index-Plug-In, Sie können es anwenden, wenn das Objekt verfügt eine Maus über Ereignis wie:

    <div id="modal" onmouseover="$(this).topZIndex();"></div>

    Ändern Sie dann die position absolute mit jquery oder auch Umgekehrt:

    $(document).ready(function(){ $('#modal').css('position','absolute'); });
    Hmmm, es scheint nicht zu funktionieren... ich habe in einem anderen jQuery-Skript, aber jetzt gibt er mir die Fehlermeldung, dass launchWindow ist nicht definiert... keine Ahnung, was zu tun ist? Auch die position muss "fest", wie ich es oben beschrieben wird, funktionieren die auch?
    Ich habe jetzt die Linie gestellt <script type="text/javascript" src="scripts/jquery.topzindex.min.js"></script> über dem anderen Skript, und keine Fehler mehr zeigen. Jedoch ist die z-index-Problem ist immer noch das gleiche...
    Ist das div in einem iframe oder einem anderen div?
    Yeah, ein weiterer div. Aber ich fixen, indem du ein weiteres div-Element auf "meine Seite", #message, die ich dann ändern Sie den html() html() der Nachricht, die ich anzeigen möchten. Eine einfache Lösung dafür. 🙂
    Oh gut, Sie können auch hängen Sie den div auf der Seite, wenn die Nachricht ist erforderlich, zulassen, dass immer pop-die Nachricht vor allem. Mit jQuery ist so einfach wie das $(document.Körper).append('<div id="Nachricht"></div>');, aber Sie müssen natürlich die entsprechenden css-Eigenschaften. Entfernen Sie einfach $('#Nachricht').entfernen();

    InformationsquelleAutor raphie

  3. 1

    CSS z-index funktioniert nicht richtig

    wenn Sie entfernen z-index von #leftbar es Ihr problem behebt. Die position sollte egal sein, solange Sie eine haben.

    Leider ist, dass der z-index ist nötig für den rest von der Seite 🙁 Vielleicht kennt Ihr eine andere Lösung?
    beim öffnen des popup entfernen #leftbar z-index, wenn Sie schließen Sie das popup-Menü wieder hinzufügen. 🙂
    eine andere Lösung wäre, ein 3-Spalten layout, wo Ihre Karte ist nicht 100% Breite, dann würden Sie nicht brauchen, z-index auf den Spalten.
    Ja, es ist eine option, aber ich möchte die Seitenleisten überlagert werden divs, danke für die Anregung!

    InformationsquelleAutor Michael

Schreibe einen Kommentar