nicht angemeldet
Walzenmenü
Hi
Ich möchte als Menü eine Art Walze einsetzen.
Es gibt z.b. insgesamt 8 Menüpunkte, aber es sollen nur immer 3 angezeigt werden. Wenn man mit der Maus nun über das Menü fährt, dann soll das Menü sich quasi wie eine Walze drehen.
Ich weiß nicht, ob man das mit JavaScript realisieren kann oder nicht.
Wenn ja, dann wäre ich für Tipps dankbar. Mit JavaScript kenne ich mich (bis jetzt) noch nicht aus, aber wenn so was möglich ist, dann werde ich es auch mal ausprobieren.
Danke schonmal
Kaylon
-
Hallo,
Mit JavaScript läßt sich viel anfangen aber es ist eine Funktionserweiterung und kein visuelles Feature. Ein Walzenmenü habe ich noch nicht gesehen, doch es wäre in gewisser Weise mit JavaScript möglich, würde aber Deinen Erwartungen nicht gerecht werden und es gäbe sicherlich auch so einige Probleme mit den verschiedensten Host-Applikationen (Browser). Frag doch einmal Cräcker wie lange er für das <www.stempelgeheimnis.de> gebraucht hat und wie lange es gedauert hat, damit der Stempel stempelt (Würde mich auch interessieren). Und das ist im Vergleich zu Deinem Walzenmenü noch recht einfach (für ihn zumindest, das hoffe ich doch). Daher, vergiß es...
Tolle Menüs findest Du z.B. unter [www.opencube.com].
hth
rico-
Danke für Deine Antwort.
Ich hatte nur an JavaScript gedacht, weil ich dachte, das ich damit kleine Bilder (entspricht den Buttons) vielleicht nach oben gleiten lassen kann und unten neue entstehen lassen kann (alles langsam scrollend).
In etwa so:1. 2. 3. 4. 5. 6.
Menü Texte Gedichte Lieder Bilder siehe 1.
Texte Gedichte Lieder Bilder Menü
Gedichte Lieder Bilder Menü TexteWomit kann ich das denn dann realisiern?
Kaylon
-
-
Hallo Kaylon!
Hier kommt eine schnell zusammengeschusterte mögliche Lösung (nicht vollständig ausgetestet), die Du an Deine Wünsche anpassen mußt:
<html>
<head>
<script language="JavaScript">
var leading_images=0; // Anzahl der Grafiken vor denen der Walzefunction to_link()
{
var punkt=document.images[leading_images+2].src;
punkt=punkt.substr(1+punkt.lastIndexOf("/"),1);
switch (punkt)
{
case "1": document.location.href="seite1.htm"; break;
case "2": document.location.href="seite2.htm"; break;
case "3": document.location.href="seite3.htm"; break;
case "4": document.location.href="seite4.htm"; break;
case "5": document.location.href="seite5.htm"; break;
case "6": document.location.href="seite6.htm"; break;
case "7": document.location.href="seite7.htm"; break;
case "8": document.location.href="seite8.htm"; break;
}
}function rotate()
{
var punkt=document.images[leading_images+2].src;
punkt=punkt.substr(1+punkt.lastIndexOf("/"),1);
var ziel_o=punkt;
var ziel_m=eval(punkt)+1;
if (ziel_m>8) ziel_m=ziel_m-8;
var ziel_u=eval(punkt)+2;
if (ziel_u>8) ziel_u=ziel_u-8;document.images[leading_images+0].src=ziel_o+"o.gif";
document.images[leading_images+2].src=ziel_m+"m.gif";
document.images[leading_images+4].src=ziel_u+"u.gif";
}
</script>
</head>
<body>
<img src="8o.gif" onClick=rotate(); ><img src="abschl_o.gif" onClick=rotate();><br>
<img src="1m.gif" onClick=to_link();><img src="abschl_m.gif" onClick=rotate();><br>
<img src="2u.gif" onClick=rotate(); ><img src="abschl_u.gif" onClick=rotate();><br>
</body>
</html>Die Dateien inklusive der Grafiken kommen per eMail!
Norbert