z-Index Manipulation
Reiner Wirth
- javascript
0 Cheatah0 Reiner Wirth0 Cheatah0 Jörg Peschke
Hallo,
ich habe ein javascript verfaßt, das mir bei jedem onmouseover einer Ebene diese nach oben stellt:
<html><head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <script type="text/javascript"> var ziTop=4, idEbene; function topLifter(ziTop,idEbene) { document.getElementById(idEbene).style.zIndex=ziTop; } </script> </head> <body bgcolor="#ffeecc"> <div style=" color: blue; background-color: #cccccc; visibility: visible; display: block; position: absolute; z-index: 1; top: 110px; left: 50px; width: 200px; height: 100px;" id="ebene1" onmouseover="topLifter(ziTop,'ebene1');" onmouseout="ziTop=ziTop+1;">Ebene 1</div> <div style=" color: red; background-color: #888888; visibility: visible; display: block; position: absolute; z-index: 2; top: 80px; left: 120px; width: 200px; height: 100px;" id="ebene2" onmouseover="topLifter(ziTop,'ebene2');" onmouseout="ziTop=ziTop+1;">Ebene 2</div> <div style=" color: green;background-color: #333333; visibility: visible; display: block; position: absolute; z-index: 3; top: 50px; left: 190px; width: 200px; height: 100px;" id="ebene3" onmouseover="topLifter(ziTop,'ebene3');" onmouseout="ziTop=ziTop+1;">Ebene 3</div> </body></html>
das hochzählen des z-Index-Wertes wird durch onmouseout im <div…> veranlaßt.
warum funktioniert nicht auch:
<script type="text/javascript"> var ziTop=100, idEbene; function topLifter(ziTop,idEbene) ziTop=ziTop+1; { document.getElementById(idEbene).style.zIndex=ziTop; } </script>
Vielen Dank
Reiner Wirth
Hi,
warum funktioniert nicht auch:
function topLifter(ziTop,idEbene)
ziTop=ziTop+1;
{
weil das kein gültiger JavaScript-Code ist.
Cheatah
Hi,
warum funktioniert nicht auch:
function topLifter(ziTop,idEbene)
ziTop=ziTop+1;
{weil das kein gültiger JavaScript-Code ist.
Cheatah
Hi
ich habe gleich nach dem posting gemerkt, daß ich die Zeile
ziTop=ziTop+1;
innerhalb der geschweiften Klammern schreiben muß, es funktioniert auch dann nicht.
Warum? Was ist falsch?
Reiner
Hi,
innerhalb der geschweiften Klammern schreiben muß, es funktioniert auch dann nicht.
Warum? Was ist falsch?
die Fehlerbeschreibung. "Funktioniert nicht" funktioniert nicht.
Cheatah
Moin,
Warum? Was ist falsch?
Ich vermute ein Gültigkeitsproblem:
function topLifter(ziTop,idEbene)
{
ziTop=ziTop+1;
document.getElementById(idEbene).style.zIndex=ziTop;
}
Wenn Du diese Funktion aufrufst, wie du es tust (mit ziTop und z.b. "ebene1"),
wird in der Funktion nicht das "ziTop" was dau außerhalb der Funktion definiert hast, benutzt - es wird lediglich dessen WERT kopiert (Call by Value).
Wenn Du jetzt in der Funktion "ziTop" verändert (z.b. erhöhst), bekommt das äußere "ziTop" davon nichts mit, weil Du in der Funktion auf einer Kopie von "ziTop" arbeitest.
Wenn die Funktion beendet wird, wird diese Kopie gelöscht, und alles ist wie vorher.
Lösung: Lass einfach den Parameter "ziTop" in der Funktion weg - dann verändert die Funktion die ziTop-Variable, die außerhalb der Funktion definiert ist, und so bleibt der neue, erhöhte Wert auch nach Erhöhung in der Funktion erhalten.
Grüße,
Jörg
Hallo Jörg,
vielen Dank, das war eine wunderbare Hilfe und Erklärung für mich, die Funktion arbeitet jetzt genau so wie ich wollte. Einen schönen Tag!
Reiner