it-swarm.com.de

Wie lässt sich eine Div auf allen anderen Bildschirminhalten darstellen?

Ich habe folgendes Popup:

enter image description here

Wenn ich dieses Popup-Fenster jedoch nach oben schiebe, wird es ausgeblendet:

enter image description here

Ich habe versucht, den Z-Index in meinem CSS-Eigenschaftsfenster festzulegen, aber das hat nicht funktioniert.

Gibt es eine HTML/CSS-Eigenschaft, die ich so einstellen kann, dass das Popup, bei dem es sich um ein DIV handelt, eigentlich immer auf alles andere gesetzt wird?

18
jordan

z-index ist kein so einfacher Freund. Es ist eigentlich egal, ob Sie z-index:999999999999..... eingeben, aber es ist wichtig, WENN Sie ihm diesen z-index gegeben haben. Unterschiedliche dom-Elemente haben ebenfalls Vorrang.

Ich führte eine Lösung aus, bei der ich mit jQuery die Elemente css modifizierte, und gab den z-index nur dann an, wenn das Element oben sein sollte. Auf diese Weise können wir sicher sein, dass der z-index dieses Artikels zuletzt angegeben wurde und der Index notiert wird. Dies erfordert zwar einige Aktionen, die in Ihrem Fall jedoch möglich sind.

Nicht sicher, ob dies funktioniert, aber Sie könnten auch den Parameter !important angeben:

#desired_element { z-index: 99 !important; }

Referenz philipwalton.com

23
GotBatteries

Verwenden Sie position: relative

Versuchen Sie, position: relative und dann den Z-Index festzulegen, da dieses div einen Z-Index im Verhältnis zu anderen Div haben soll.

Ihr Browser ist übrigens wichtig, um zu überprüfen, ob er funktioniert. Weder IE noch Firefox ist ein guter.

10
Hugo Sousa

Stellen Sie den Z-Index des DIV auf einen größeren Wert als die anderen DIVs. Sie müssen auch sicherstellen, dass für das DIV auch eine andere position als static festgelegt ist.

CSS:

#someDiv {
    z-index:9; 
}

Lesen Sie hier mehr: http://coding.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/

5
Jason

Stellen Sie die Position auf absolut, dh. 

#yourDiv{
    position: absolute;
    z-index: 10;
};
4
Paul G

sie sollten position:fixed verwenden, um z-index-Werte für Ihr div festzulegen

Ein Formular dazu ist das Einfügen des Felds, das Sie erweitern möchten, in ein als relativ festgelegtes DIV: Lassen Sie sich zeigen:

<div style="position:relative">
  <div style="position:absolute; z-index: 1000;">
    your code
  </div>
<div>

Sie verwenden das erste div, um den inneren Inhalt in einem bestimmten Bereich innerhalb Ihrer Seite zu positionieren, und das zweite absolute sollte auf den Container verwiesen werden (weil relativ) Behälter sollte oben sein. Sie können den Stil in eine CSS-Klasse einfügen und die Größe des absoluten Div ändern, um ihn im Hover oder einer anderen Aktion, die Sie steuern möchten, zu erweitern.

Ich hoffe das hilft

1
freedeveloper