PopUp-Menu mit onClick() und onMouseOver()

[Baerwatz]

Hallo, ich hab ein Problem und ich hoffe mir kann einer von Euch helfen.

Ich soll ein PopUp-Menu realisieren, das standartmäßig geöffnet ist. Bei Click auf das Bild über dem Menu, soll sich dieses schließen und auch das Bild soll sich ändern. Wenn man nun wieder auf das Bild clickt, öffnet sich das Menu wieder. Das Menu selbst soll einen MouseOver-Effekt besitzen. Wenn man über die Links fährt, soll sich die Hintergrund- und die Schriftfarbe ändern.

Ich hab schon hier und in anderen Foren gekuckt, hab aber zu meinem Problem nix passendes gefunden.

Ich hab mal ein Bild vom offenen Menü angehängt.

 

[Baerwatz]

Hier noch das geschlossene Menu:

 

[Thomas Lindner]

http://www.tutorials.de/tutorials130001.html

http://www.tutorials.de/tutorials130021.html

http://www.tutorials.de/tutorials7309.html

http://www.tutorials.de/tutorials129991.html

 

[Baerwatz]

Danke für die Tipps.
Ich bins gerade am Umschreiben, so dass es für meine Bedürfnisse passt.

Nur ein Problem bleibt: Wie kann ich das Bild bei Anklicken verändern?
Es soll also bei ausgeklapptem Menu ein anderes Bild angezeigt werden als bei geschlossenem Menu.
Wenn Du mir dabei auch noch helfen könntest wäre das echt super!

 

[Thomas Lindner]

Da bin ich noch am grübbeln, es ist nicht die Hilfe die ich verweiger, sondern der Brain.

Mir ist zwar jklar wie ich das Bild auf Klicjk ändere, aber bei erneutem Klick soll ja vermutlich, bzw. bei Klick auf ein anderes Menü das Bild zurückgesetzt werden und zur Zeit "hänge" ich dort noch.

Vielleicht bin ich aber auch nur zu müde.

 

[Sven Mintel]

Hallo....

ich weiss jetzt nicht, welches der Menues du genommen hast, aber ich schätze mal, dass sich die Links alle in einem
Layer befinden... dann ist es am bequemsten, wenn du abfragst, ob dieser Layer grad angezeigt wird(oder auch nicht)....
und darauf ensprechend reagierst....könnte ca.so aussehen:

<script type="text/javascript">
<!--
function showHideMenu()
{
arrImages=new Array();
arrImages['none']='popup_c.gif';
arrImages['block']='popup_o.gif';
showHide=(document.getElementById('links').style.display!='none')?'none':'block';
document.oc.src=arrImages[showHide];
document.getElementById('links').style.display=showHide;
}
//-->
</script>

<!-- .... -->

<div style="width:185px"id="menu">
<img name="oc"src="popup_o.gif"border="0"onclick="showHideMenu();">
<div id="links">
<a href="seite1.htm"><img src="link1.gif"border="0"></a>
<a href="seite2.htm"><img src="link2.gif"border="0"></a>
<a href="seite3.htm"><img src="link3.gif"border="0"></a>
</div>
</div>

-->Test

 

[Baerwatz]

Danke fatalus,

jetzt funtzts!
Wenn man weiß wies geht, ist es gar nicht so schwer!