Hauptmenu = Submenu

matthiasschnueriger

matthiasschnueriger

Erfahrenes Mitglied
Hallo allerseits!

Ich bin mir nicht sicher, oh ich im richtigen Forum bin, versuche es aber einfach mal :-)

Ich habe ein zweistufiges Javascript-Menü erstellt. Das Hauptmenü ist grau, bei Rollover wird es orange. das Submenü ist orange.
Wenn ich also aufs Hauptmenü klicke, geht das Submenü auf.

Was ich jetzt möchte ist, dass nach dem Öffnen eines Submenüs das Hauptmenü orange.

Hat jemand eine Ahnung, wie ich das Hauptmenü quasi "aktiv" halten kann, damit es orange bleibt?

Danke und Gruss, Matthias

PS: Das ganze klingt jetzt vielleicht kompliziert... sorry!
 
Hi,

klingt so, als würde die Farbe des Menüs passend geändert werden, wenn der EventHandler onMouseOver feuert, jedoch wieder zurückgesetzt werde, sobald die Maus das Element wieder verlässt und dann der Handler onMouseOut feuert.
Ansonsten würde schätzungsweise die Hintergrundfarbe erhalten bleiben.

Kann's also sein, dass du einfach nur einen onMouseOut-Handler im Quelltext hast, den du lediglich entfernen müsstest? :)
Wenn das nicht der Fall ist, wirst du wohl deinen Menücode mal hier verlinken oder besser einbinden müssen...zumindest den relevanten Script-Teil.

Gruß,
Adam
 
Erst mal danke für die Antwort.

Ich habe eigentlich schon ein onMouseOver im Quelltext.
Nochmal meine "Wunschvorstellung": Das Hauptmenü soll
orange bleiben, wenn man in der entsprechenden Kategorie ist.
In der Ist-Situation ist nur der Rollover orange.

Vielen Dank für eure Hilfe!

Hier mein gesamter Code:
HTML: 
<html>
<head>
<title>Navigation</title>

<style type="text/css">

body { font-family:arial;font-size:11px;color:#CCCCCC; }

a:link { font-family:arial;font-weight:bold;font-size:13px;color:#CCCCCC;text-decoration:none; }
a:active { font-family:arial;font-weight:bold;font-size:13px;color:#FF9900;text-decoration:none; }
a:visited { font-family:arial;font-weight:bold;font-size:13px;color:#CCCCCC;text-decoration:none; }
a:hover { font-family:arial;font-weight:bold;font-size:13px;color:#FF9900;text-decoration:none; }

a:link.sub { font-family:arial;font-weight:normal;font-size:12px;color:#FF9900;text-decoration:none; }
a:active.sub { font-family:arial;font-weight:normal;font-size:12px;color:#FF9900;text-decoration:none; }
a:visited.sub { font-family:arial;font-weight:normal;font-size:12px;color:#FF9900;text-decoration:none; }
a:hover.sub { font-family:arial;font-weight:normal;font-size:12px;color:#666666;text-decoration:none; }

</style>

<script type="text/javascript">
<!--

function show(divid) {
document.getElementById("panoramen").style.display="none";
document.getElementById("angebote").style.display="none";
document.getElementById("ueberuns").style.display="none";

document.getElementById(divid).style.display="inline";

}
//-->
</script>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#FFFFFF" leftmargin="0">
<a href="?id=home.php">Home</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="#" onmouseover="show('panoramen')">Panoramen</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="#" onmouseover="show('angebote')">Produkte</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="?id=werbung.php">Werbung</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="?id=partner.php">Partner</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="?id=support.php">Support</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="#" onmouseover="show('ueberuns')">&Uuml;ber uns</a>&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp; 
<a href="?id=kontakt.php">Kontakt</a><br>
 


<div id="panoramen" style="display:none"><img src="bilder/pixel.gif" width="55" height="1"> 
  <a href="?id=panoramen-suche.php" class="sub">Suche</a>&nbsp;&nbsp;&middot;&nbsp; 
  <a href="?id=panoramen-neue.php" class="sub">Neue Panoramen </a>&nbsp;&middot;&nbsp; 
  <a href="?id=panoramen-top10.php" class="sub">Top10</a> </div>

<div id="angebote" style="display:none"><img src="bilder/pixel.gif" width="149" height="1"> 
  <a href="?id=produkte-angebote.php" class="sub">Angebote</a>&nbsp;&nbsp;&middot;&nbsp; 
  <a href="?id=produkte-bestellung.php" class="sub">Bestellung</a> 
</div>

<div id="ueberuns" style="display:none"><img src="bilder/pixel.gif" width="443" height="1"> 
  <a href="?id=ueberuns-team.php" class="sub">Team</a>&nbsp;&nbsp;&middot;&nbsp; 
  <a href="?id=ueberuns-vision.php" class="sub">Vision</a> 
</div>
  

  </body>
</head>
</html>
 
du musst einfach das gleiche machen wie bei den submenüs
erst alle menüpunkte grau setzen und dann den gewählten orange machen
mit document.getElementById("dieiddeshauptmenuepunktes").style.color="#FF9900";
flooo
 
Also das funktioniert nicht...
Habe ich das richtig verstanden, ich sage z.B.

Code: 
document.getElementById("home").style.color="#FF9900";

und dann im Link

Code: 
<a href="home.php" onmouseover="show('home')">Home</a>

Dann ändert sich nämlich genau nichts....

Gruss Matthias
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück