Viktor's Supportboard (https://www.v-gn.de/wbb/index.php)
- Programmieren (https://www.v-gn.de/wbb/board.php?boardid=87)
-- HTML, XHTML, JavaScript und CSS (https://www.v-gn.de/wbb/board.php?boardid=88)
--- z-index funktioniert nicht (https://www.v-gn.de/wbb/thread.php?threadid=13796)
Geschrieben von LaserDancer am 23.02.2011 um 14:05:
z-index funktioniert nicht
Hallöchen,
ich stehe mal wieder vor einem Rätsel. Ich habe in meinem Board ein CSS-Dropdown Menü, welches auch einwandfrei funktioniert.
Um auf Radio-Sendungen aufmerksam zu machen, haben wir einen Javascript-Ticker den die Modis selber bedienen können.
Wenn nun jemand das Menu öffnet liegt der Ticker dadrüber. Beides ist in <div> eingebunden und für beides ein z-index im Designpack definiert. Das Menu hat z-index 10, der Ticker 0, sollte also als unterster Layer liegen.
Klappt nur nicht in allen Browsern. Habe es unter anderem mit Firefox 3.5.16 ausprobiert und es will nicht wie es soll.
Wie bekomme ich den verdammten Ticker dazu hinter dem aufklappenden Menu zu bleiben???
Geschrieben von Diabolo am 23.02.2011 um 17:38:
RE: z-index funktioniert nicht
|
Zitat: Original von LaserDancer
Hallöchen,
ich stehe mal wieder vor einem Rätsel. Ich habe in meinem Board ein CSS-Dropdown Menü, welches auch einwandfrei funktioniert.
Um auf Radio-Sendungen aufmerksam zu machen, haben wir einen Javascript-Ticker den die Modis selber bedienen können.
Wenn nun jemand das Menu öffnet liegt der Ticker dadrüber. Beides ist in <div> eingebunden und für beides ein z-index im Designpack definiert. Das Menu hat z-index 10, der Ticker 0, sollte also als unterster Layer liegen.
Klappt nur nicht in allen Browsern. Habe es unter anderem mit Firefox 3.5.16 ausprobiert und es will nicht wie es soll.
Wie bekomme ich den verdammten Ticker dazu hinter dem aufklappenden Menu zu bleiben??? |
|
|
da es sich um das dropdown menü handelt solltest du die z-index auf 120 setzen dann gehts, denn mit der angegebenen höhe gibst du an ob es über oder unter einem object steht.
und da es so klein bei dir ist wird es von dem anderen object überlagert, und wenn die z-index davon auf 100 steht sollte das menü eine höhere haben
wie gast 120 oder 110 dürfte auch reichen
gruss
Geschrieben von LaserDancer am 23.02.2011 um 19:52:
Keine Chance,
ich habe den Ticker nun im header.tpl vor dem Menu platziert und über CSS ausgerichtet. Ich habe den z-index auf 120 gesetzt.
Es ändert sich nichts. Im Firefox 3.6 läuft es wie gewünscht, im Firefox 3.5 und IE 7 wie auf dem Bild zu sehen.
:-(
Geschrieben von Diabolo am 24.02.2011 um 10:27:
gebe mal den link, dann schaue ich es mir mal an
gruss
Geschrieben von LaserDancer am 24.02.2011 um 10:51:
www.rubens-freunde.de ;-)
Warte, ich muss nochmal den Ticker wieder auf seine ursprüngliche Position setzen...
So alles zurück auf Start ;-)
Geschrieben von Diabolo am 24.02.2011 um 12:17:
füge das mal im css ein:
#nav-container div, #nav-container ul {
z-index:120;
}
gruss
Geschrieben von LaserDancer am 24.02.2011 um 12:37:
Habe ich eingefügt, im IE jedenfalls keinerlei Änderung zu sehen. FF 3.5 habe ich jetzt nicht da...
:-(
Geschrieben von Diabolo am 24.02.2011 um 18:19:
kann es sein das das Menü ein eigenes CSS hat ?
gruss
Geschrieben von LaserDancer am 24.02.2011 um 18:58:
Ja hat es und genau dort habe ich den Code von dir auch eingefügt... ;-)
Ich habe den z-index dann auch mal gleich noch um einiges erhöht, da ich gesehen habe das zum Beispiel mein jquery-Slider auf der Seite einen von 1000 zugewiesen bekommen hat. Aber selbst ein z-index von 5000 hat nun keinen Erfolg gebracht, der Ticker ist nach wie vor im Vordergrund.
Geschrieben von Diabolo am 26.02.2011 um 23:45:
musst mal die css vom klappmenü durchsehen und dort schauen das dort die höchste z-index ist und den lauftext niedrig stellen, muss schauen ob der lauftext ne eigene css hat.
ist ne test sache und ein wenig fummelei mit der z-index
gruss
Geschrieben von LaserDancer am 27.02.2011 um 10:59:
Tja, das Menu hat inzwischen z-index von 50.000, der Lauftext kein eigenes CSS, aber als DIV ein z-index von 1 zugewiesen bekommen und es ändert sich nichts.
Habe jetzt den Lauftext jeweils oberhalb des Menus platziert, damit er nicht stört. Ist zwar nicht ganz so schön vom Design, aber im moment scheinbar nicht anders machbar.
Geschrieben von blaster am 27.02.2011 um 11:28:
Die Regel zu z-index lautet - ich zitiere:
|
Zitat: Diese Eigenschaft wirkt nur in Verbindung mit einer Angabe zu position. |
|
|
Und diese Angabe fehlt in beiden Containern. Füge beiden die Eigenschaft z.B.
code: |
1:
|
position: relative; |
|
hinzu.
http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index
Falls du noch nicht hast, kann ich dir nur das kostenlose Firefox Addon - Firebug wärmstens empfehlen.
Geschrieben von LaserDancer am 27.02.2011 um 11:55:
|
Zitat: Und diese Angabe fehlt in beiden Containern. Füge beiden die Eigenschaft z.B. |
|
|
Nö, tut sie nicht, die Angabe ist in der CSS des jeweiligen Design-Packs drin ;-)
Geschrieben von blaster am 02.03.2011 um 19:48:
mhh... also ich sehe diese Angabe weder im div.radioticker noch im div.nav-container-outer
Forensoftware: Burning Board 2.3.6, entwickelt von WoltLab® GmbH