Problem mit Layern
Udo Saemann
- javascript
Hallo,
ich bastle mit gerade ein Menu zusammen, das beim Anklicken ein Submenü aufklappt.
Dies mache ich bei Netscape durch Beschreiben der Eigenschaft "visibility". Soweit klappte alles wunderbar.
Als ich aber den aktuellen Menu-Eintrag mit "onmouseover" hervorheben wollte (bei Netscape), kamen die Probleme.
Ich habe um jeden Menu-Eintrag (SubMenu1, SubMenu2, ...)
ein "<div id="menu1Childx"></div>"
herumgebaut, um so die Hintergrundfarbe oder
die Schriftfarbe mit der Funktion "highlight()" über einen zusaetzlichen Layer ändern zu koennen. Auswirkungen bzw. Erfolg hatte dies aber überhaupt nicht. Alles war wie vorher.
Wenn ich aber die Farbzuweisung auf das übergeordnete Layer (menu1Child) mache anstatt auf (menu1Child1) funktioniert alles. Nur möchte ich eben nicht das gesamte Untermenü hervorheben sondern nur den einzelnen Menupunkt.
Liegt das Problem an meiner Funktion "highlight" oder ....
Für einen Tip wäre ich euch sehr dankbar. Gibt es vielleicht eine ganz andere (einfachere) Lösung für das Problem.
Ich hoffe ich habe alle nötigen Infos nachfolgend zusammen "geschnippelt". Eine URL, wo man sich das ganze anschauen kann, gibt es leider noch nicht.
Im Body hatte ich folgenden Aufbau:
<body onload="javascript:aufklappen('menu1')" bgcolor="#000000" text="#cccccc" link="#cccccc" vlink="#cccccc" alink="#cccccc">
<!-- *********** -->
<!-- M E N U 1 -->
<!-- *********** -->
<div id="menu1Parent" class="parent" style="padding-top:3;">
<a href="#" class="item" target="home" onclick="aufklappen('menu1')" onmouseover="window.status='';return true">
<img name="menu1Pic" src="menu-dateien/d_open.gif" border=0 width=12 height=12>Menu1</a>
</div>
<div id="menu1Child" class="child">
<div id="menu1Child1"><a class="item" href="#" target="home" onclick="test(this)" onmouseover="highlight('menu1Child1')">SubMenu 1</a></div>
<div id="menu1Child2"><a class="item" href="#" target="home" onclick="test(this)" onmouseover="highlight('menu1Child2')">SubMenu 2</a></div>
<div id="menu1Child3"><a class="item" href="#" target="home" onclick="test(this)" onmouseover="highlight('menu1Child3')">SubMenu 3</a></div>
<div id="menu1Child4"><a class="item" href="#" target="home" onclick="test(this)" onmouseover="highlight('menu1Child4')">SubMenu 4</a></div>
<div id="menu1Child5"><a class="item" href="#" target="home" onclick="test(this)" onmouseover="highlight('menu1Child5')">SubMenu 5</a></div>
</div>
...
...
Für die Darstellung der Menu-Eintraege habe ich diese Style-Sheets definiert:
<STYLE type='text/css'>
.parent { position:absolute; font-weight:bold; width:150; height:25; clip:rect(0 150 25 0); padding-top:3; padding-left:3; padding-bottom:3; }
.child { position:absolute; width:200; padding-left:20; padding-bottom:5; margin:5; visibility:hidden; }
</STYLE>
Für das Hervorheben des aktuellen Menu gibt es diese Funktion:
<script>
function highlight (LID)
{
if (document.layers)
{
var vari = document["menu1Child"].document[LID].document;
vari.bgColor = "red";
}
}
</script>
Hi,
Als ich aber den aktuellen Menu-Eintrag mit "onmouseover" hervorheben wollte (bei Netscape), kamen die Probleme.
Ich habe um jeden Menu-Eintrag (SubMenu1, SubMenu2, ...)
ein "<div id="menu1Childx"></div>"
herumgebaut, um so die Hintergrundfarbe oder
die Schriftfarbe mit der Funktion "highlight()" über einen zusaetzlichen Layer ändern zu koennen. Auswirkungen bzw. Erfolg hatte dies aber überhaupt nicht. Alles war wie vorher.Wenn ich aber die Farbzuweisung auf das übergeordnete Layer (menu1Child) mache anstatt auf (menu1Child1) funktioniert alles. Nur möchte ich eben nicht das gesamte Untermenü hervorheben sondern nur den einzelnen Menupunkt.
Liegt das Problem an meiner Funktion "highlight" oder ....Für einen Tip wäre ich euch sehr dankbar. Gibt es vielleicht eine ganz andere (einfachere) Lösung für das Problem.
Vielleicht hilft Dir mal anzuschauen, wie man sowas auch anders lösen kann, z.B. mit Grafik: http://www.webreference.com/dhtml/column2/
Sieht dann so aus, wie beim Jura-zoo das Menü.
Mit der von dir gewählten Weise klappt das meines wissens nicht, da Netscape bei solchen Änderungen keinen neuen Bildschirmaufbau macht. D.h. die Hintergrundfarbe ändert sich schon, nur sieht man es nicht. Kanns ja mal einen kleinen test bauen, in dem du die Hintergrundfarbe abfragst.
Hoffe dir hilft das.
Gruß
Harald