Suche Menü bzw. namen davon!
Daniel
- javascript
Hi leute,
guckt euch mal das navi script von alternate.de an! weiß einer von euch wo ich ein vergleichbares finde, mit diesen rollover effekten? mir gelang es leider nicht den quelltext auseinander zunehmen! das coole ist an dem menü das es für alle gängigen browser past! IE, N, M, MF, O...
mfg derDani
Hallo Daniel,
guckt euch mal das navi script von alternate.de an! weiß einer von euch
ist ja auf'n ersten Blick ganz nett das Menü unter www.alternate.de, aber versuche mal von Konfiguratoren auf PC-Builder zu kommen!
Mit freundlichen Grüßen
André
ähmm das sagt mir jetzt nicht wirklich viel, sry! :-/
mfg Dani
Hi,
mir gelang es leider nicht den quelltext auseinander zunehmen!
Oh. =:-o
das coole ist an dem menü das es für alle gängigen browser past! IE, N, M, MF, O...
Das ist nicht "cool", das ist selbstverständlich!
Jedenfalls sollte dies so ein.
Gar nicht "cool" ist hingegen der Umstand, daß auf älteren Browsern vermutlich Fehlermeldungen produziert werden (DOM-Level-2-Zugriffe ohne Gültigkeits-Check) und der Back-Button blockiert wird ("META-0-Refresh").
Zur eigentlichen Frage: Beschäftige Dich mit getElementById & Co., sowie, vermutlich, innerHTML (HTML-Code einfügen/entfernen) und/oder style.dispay (Elemente anzeigen/verstecken). Damit lassen sich leicht browserübergreifend DTHML-Menüs verwirklichen, in dem Du darstellst/nicht darstellst, was Du gerade brauchst/nicht brauchst.
Meine, von mir immer gerne genannte (>;->), diesbezügl. Schlag-mich-tot-Universalroutine: Coding: Darstellungswechsel - Un-/Sichtbare Elemente: Ein-/Ausklappen, Verstecken, Transparenz, Farbe
Mit der habe ich auch schon ein solches Menü ähnlich alternate.de umgesetzt - selbstredend ohne deren Fehler. >;-> Die Grenze bei der Umsetzung ist nur die Grenze deiner Phantasie ... ;-)
Gruß, Cy-"JavaScript 1.5 is the limit"-baer
was sagst du denn hierzu:
<html>
<head>
<style>
.menu {font-family:verdana;font-weight:bold;font-size:11px;color:black;text-decoration:none;}
a.menu:link {font-family:verdana;font-weight:bold;font-size:11px;color:black;text-decoration:none;}
a.menu:visited {font-family:verdana;font-weight:bold;font-size:11px;color:black;text-decoration:none;}
a.menu:hover {font-family:verdana;font-weight:bold;font-size:11px;color:red;text-decoration:underline;}
a.menu:active {font-family:verdana;font-weight:bold;font-size:11px;color:black;text-decoration:none;}
.sub {font-family:verdana;font-size:11px;color:black;text-decoration:none;}
a.sub:link {font-family:verdana;font-size:11px;color:black;text-decoration:none;}
a.sub:visited {font-family:verdana;font-size:11px;color:black;text-decoration:none;}
a.sub:hover {font-family:verdana;font-size:11px;color:red;text-decoration:underline;}
a.sub:active {font-family:verdana;font-size:11px;color:black;text-decoration:none;}
</style>
<script language=javascript>
<!--
var nam = new Array('startseite','news','mytalklevel','events','members','unterhaltung','about');
function manage(nav)
{ swap('startseite',0);
swap('news',0);
swap('mytalklevel',0);
swap('events',0);
swap('members',0);
swap('unterhaltung',0);
swap('about',0);
if(nav!='')
{
swap(nav,1);
}
}
function swap(id, mode)
{
if(document.getElementById(id+"_sub"))
{
if (mode==1)
{
document.getElementById(id+"_sub").style.display = "block";
}
else
{
document.getElementById(id+"_sub").style.display = "none";
}
}
}
//-->
</SCRIPT>
</head>
<body bgcolor="#EFEFEF">
<table>
<tr>
<td>
<a class="menu" href="#" onMouseOver="manage('startseite');">Startseite</a>
<a class="menu" href="#" onMouseOver="manage('news');">News</a>
<a class="menu" href="#" onMouseOver="manage('mytalklevel');">MyTalklevel</a>
<a class="menu" href="#" onMouseOver="manage('events');">Events</a>
<a class="menu" href="#" onMouseOver="manage('members');">Members</a>
<a class="menu" href="#" onMouseOver="manage('unterhaltung');">Unterhaltung</a>
<a class="menu" href="#" onMouseOver="manage('about');">About</a>
</td>
</tr>
</table>
<div id="startseite_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">SingleDatenbank <b>·</b> Kinotipp vom 27.01.2005 <b>·</b> Neuanmeldungen Heute: 0</td></tr></table></div>
<div id="news_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Top 10 News <b>·</b> News Archiv <b>·</b> Talklevel News</td></tr></table></div>
<div id="mytalklevel_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Setup <b>·</b> Logout <b>·</b> Ansprechpartner</td></tr></table></div>
<div id="events_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Partybilder <b>·</b> Termine <b>·</b> HALL OF FAME <b>·</b> Die 30 besten Bilder</td></tr></table></div>
<div id="members_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Mitgliederliste <b>·</b> User Suche</td></tr></table></div>
<div id="unterhaltung_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Forum <b>·</b> Chat <b>·</b> SHOW MY DAY</td></tr></table></div>
<div id="about_sub"><table bgcolor="#FFFFFF"><tr><td class="sub">Kontakt <b>·</b> Impressum <b>·</b> Nutzungsbedingungen <b>·</b> Haftungsausschluss</td></tr></table></div>
<script language=javascript>
<!--
manage('startseite');
//-->
</SCRIPT>
</body>
</html>
funzt wirklich sehr gut auf allen browsern etc. läuft auch wie das gewünschte nur das, dass menü beim verlassen eines punktes nicht zum alten wieder back springt... d.h. wenn der punkt news aktiviert ist und man geht mit dem curser über den punkt members, dann bleibt das menü bei members und geht net back auf news... hmm :-/
mfg Dani
Hi,
was sagst du denn hierzu:
Also "auseinandernehmen" oder testen werde ich es nicht. =;-)
Aber die Richtung ist die von Dir gewünschte! :-)
Beim Überfliegen festgestellt:
<script language=javascript>
Nun ja ...
if(document.getElementById(id+"_sub"))
Wie alternate.de: ältere Browser brauchen hier noch ein "document.getElementById &&" am Anfang der Bedingungsklammer.
<a class="menu" href="#"
Hier sollte was sinnvolles rein, damit auch ältere Browser bzw. Suchmaschinen oder Browser mit abgeschaltetem Scripting nicht stranden.
funzt wirklich sehr gut auf allen browsern etc. läuft auch wie das gewünschte nur das, dass menü beim verlassen eines punktes nicht zum alten wieder back springt... d.h. wenn der punkt news aktiviert ist und man geht mit dem curser über den punkt members, dann bleibt das menü bei members und geht net back auf news... hmm :-/
Einfach das originale Menü, ggf. nach einer Zeitverzögerung, einblenden (onMouseOut beimMenü oder onMouseOver imNicht-Menü-Bereich. Welches das "originale Menü" ist, kannst Du ja in einer Variablen definieren, oder aus der Seite auslesen, oder aus dem Dateinamen auslesen, oder ... ;-)
Gruß, Cybaer
@Cybaer hast ne E-Mail...
mfg Dani
Hallo!
@Cybaer hast ne E-Mail...
https://forum.selfhtml.org/?t=100119&m=612899: Augen auf ;-)
mfg Alfie
ja also zu C++ kannste mich alles fragen bei javascript hab ich echt kein plan!
<script language=javascript>
fehlen da nur die " oder wie?
if(document.getElementById(id+"_sub"))
da bin ich total überfragt!
mfg dani
Hi,
<script language=javascript>
Petitesse: <script type="text/javascript" language="JavaScript">
Ersteres ist HTML-Standard, letzteres "JavaScript-Standard". " verstehen sich eh von selbst.
if(document.getElementById(id+"_sub"))
if(document.getElementById && document.getElementById(id+"_sub"))
Gruß, Cybaer
@Cybaer heyheyhey, danke!!! so muss das dann aussehen, oder unten nochmal das ganze?
function swap(id, mode)
{
if(document.getElementById && document.getElementById(id+"_sub"))
{
if (mode==1)
{
document.getElementById(id+"_sub").style.display = "block";
}
else
{
document.getElementById(id+"_sub").style.display = "none";
}
}
}
mfg derDani
Hi,
@Cybaer heyheyhey, danke!!! so muss das dann aussehen,
Jojojo! ;-)
Gruß, Cybaer