Mouseover-Klappmenü - nebeneinander

ClouD361

Mitglied
Moin Jungs und Mädels,

gleich zum Thema:

Was ich mir Vorstelle:
Ich habe mehrere Bilder neben einander die als Navigation dienen.
z.B. so:

Main - Clan - Server - Misc

jeweils als ein Bild. Ich möchte, dass die Links, die zu den Kategorien gehören unter den Bilder auftauchen und dass ein anderes Bild angezeigt wird.

Ich kriege es nur soweit hin:
Mit der Maus über das Bild gehen -> anderes Bild wird angezeig + die ganzen Links werden angezeigt. Wenn ich aber jetzt die Maus auf einen der Links gehen möchte verschwinden die Links, weil ich ja vom Bild runter gegangen bin :D Die links sollen aber automatisch weggehen, wenn ich auf eine andere Kategorie mit der Maus rüber gehe, weil sich sonst alles verschiebt...

Ein kleines Bild dazu ist im Anhang. So ähnlich soll es aussehen. Natürlich nicht so hässlich :D

Hier könnt ihr euch das angucken http://www.evo-esp.com

Auf der Seite ist zur Zeit kein mouseover effekt, aber der ist ja schnell gemacht.

Und der Quelltext darf natürlich auch nicht fehlen.
HTML:
<script type="text/javascript">
function main(Id) {
var KlappText = document.getElementById('Lay'+Id);
var KlappBild = document.getElementById('Pic'+Id);
var jetec_Minus="[dir]/images/main.jpg", jetec_Plus="[dir]/images/main2.jpg";
if (KlappText.style.display == 'none') {
KlappText.style.display = 'block';
KlappBild.src = jetec_Minus;
} else {
KlappText.style.display = 'none';
KlappBild.src = jetec_Plus;
}}
</script>

HTML:
<a href="javascript:main(1)"><img src="[dir]/images/main2.jpg" id="Pic1" border=0></a>
    <div id="Lay1" style="display: none;">
     &nbsp;
	 <a href="/index.php" class="navi">News</a> - 
	 <a href="/news/index.php?action=archiv" class="navi">Newsarchive</a> -
	 <a href="/forum/index.php" class="navi">Forum</a> -
	 <a href="/gb/index.php" class="navi">Guestbook</a> -
	 <a href="/kalender/index.php" class="navi">Kalender</a> -
	 <a href="/votes/index.php" class="navi">Umfragen</a> -
	 <a href="/links/index.php" class="navi">Links</a> -
	 <a href="/sponsors/index.php" class="navi">Sponsoren</a> -
	 <a href="/downloads/index.php" class="navi">Downloads</a> -
	 <a href="/user/index.php?action=userlist" class="navi">User</a> -
    </div>

Ich hoffe ich habt mich verstanden ^^

Gruß

ClouD361
 

Anhänge

  • 27741attachment.jpg
    27741attachment.jpg
    32,5 KB · Aufrufe: 31
Hmm...vllt könnt ihr euch das nicht vorstellen oder ich weiß ja nicht ^^ Ich hab aber ein Beispiel gefunden :)

Tera-Gaming

So ein Script hätte ich auch gerne wie bei den oben im Menü.
 

Neue Beiträge

Zurück