Menü mit JavaScript

[Flitz]

Servus!

Weiß einer wo ich den Code für genau so ein Menü her bekomme????

Kunst bei Würth

Ich finde des genial! bin durch ein Zufall drauf gestoßen! Wollte es mir herutnerladen damit ich es mir für meine Page anpassen kann! Allerdings sit das Script ausgelagert und da komme ich daj a wolh nicht ran!

Verboten ist das ja nicht oder?

[datensurfer]

Original geschrieben von Flitz

Servus!

Weiß einer wo ich den Code für genau so ein Menü her bekomme????

Kunst bei Würth

Ich finde des genial! bin durch ein Zufall drauf gestoßen! Wollte es mir herutnerladen damit ich es mir für meine Page anpassen kann! Allerdings sit das Script ausgelagert und da komme ich daj a wolh nicht ran!

Verboten ist das ja nicht oder?

1. Falsch, du kommst da ran ob ausgelagert oder nicht!

2. Wieder falsch, denn es ist verboten nach dem neuen Urhebergesetz!

3. http://www.selfhtml.net --> lesen, verstehen, umsetzen..

[Flitz]

also ich weiß nicht wie man da ran kommt! speichern kann man die Seite nicht! die funktion ist gesperrt!

Kennt jemand ein vergleichbares Menü? also mit gleichem Aufbau das man rechtlich verwenden darf?

[Spike]

Ich würd heutzutage kein JavaScript-Menü mehr benutzen. Es gibt soooo viele geile CSS-Menüs, die auf allen aktuellen CSS2-Browsern laufen.

Beispiele gibt es unter http://www.drweb.de/csspraxis/index.shtml genug.

Ganz unten im Text sind übrigens auch sehr gute Links ...

Mein Favorit:

http://www.simplebits.com/archives/2003/09/30/accessible_imagetab_rollovers.html#comments

[Muadibb]

wäre nicht eine lösung auch asp oder jsp seiten zu erstellen?

ich weiss, muss man sich auch erst reinarbeiten... aber ich denke es lohnt sich

[Flitz]

so...

Jetzt hab ich mir die Beispiele mit CSS angeschaut! sieht ja alles gnaz gut aus!

Aber ich habe folgendes Problem:

Ich möchte nicht den Hintergrund von irgendeinem Text ändern wie es bei dne Beispielen ist sonder bei einem Mousover soll sich der Hintergrund der ganzen Spalte ändern!

Ich hatte so ein Problem schon mal!

Da half mir das hier weiter --> letztes Topic <--

Allerdings funktionierte die Lösung mit den 2 unterschiedlichen Hintergründne nur wenn ich Tabelleninhalt als Grafik darstellte die genau so groß ist wie die Spalte!

Das will ich haber dieses mal nicht machen! es soll in der Spalte ein einfacher text stehen! und sobald man über die Spalte fährt soll der Hintergrund dieser Spalte sich ändern!

am besten wäre es natürlich wenn sich die Farbe des darin befinden Text sich auch gleich mitändern würde!

Hat da jemand nen Lösungsvorschlag?

mit css oder JS?

[computercrustie]

Schau dir mal das Menu an: http://www.sv-granschuetz.de

Wenn du soetwas meinst, dann kann ich dir weiterhelfen.

[Flitz]

ja genau! so was wie ganz oben in dem Banner der Seite verwendet wird suche ich! Des wäre echt gut!

[computercrustie]

Das meinte ich ja auch.

Also das Prinzip ist recht einfach

Ich habe die Haupteinträge als div's mit einer ID gemacht, die mit mit dem Maus-Event eine JavaFunktion aufrufen.

Die Untereinträge sind ebenfalls divs, die von o.g. Funktion auf visible geschalten werden, sobald die Maus darüber fährt, sonst sind sie hidden.

Für den HTML-Code kannst du dir ja den Quelltext der Seite ansehen, das Script sieht so aus:

//<!--


var DHTML = 0, DOM = 0, MS = 0;


var subs=new Array();

for (a=1;a<5;a++)

{

	subs[""+a+""]=0;

}


if(document.all) {

  DHTML = 1;

  MS = 1;

}

if(document.getElementById) {

  DHTML = 1;

  DOM = 1;

}



function NoBorder(elem) {

	with (elem.style) {

	 borderLeft="0px";

	 borderTop="0px";

	 borderRight="0px";

	}

}


function Border(elem) {

	with (elem.style) {

	 borderLeft="black 1px solid";

	 borderTop="black 1px solid";

	 borderRight="black 1px solid";

	}

}


function Show(type) {

 var mtype="menu"+type;

 var stype="sub"+type;

 if (MS && !DOM) {

	 melem=this.document.all[mtype];

	 selem=this.document.all[stype];

 } else if (DOM) {

	 selem=this.document.getElementById(stype);

 	 melem=this.document.getElementById(mtype);

 }

 selem.style.visibility="visible";

 melem.style.backgroundColor="SkyBlue";

 Border(melem);

}


function Hide(type) {

 var mtype="menu"+type;

 var stype="sub"+type;

 if (MS && !DOM) {

  	selem=document.all[stype];

  	melem=document.all[mtype];

 } else if (DOM) {

 	selem=document.getElementById(stype);

 	melem=document.getElementById(mtype);

 }

 selem.style.visibility = "hidden";

 melem.style.removeAttribute("backgroundcolor","false");

 NoBorder(melem);

}


function mouseover(type) {

 Show(type);

}	


function mouseout(type) {

  if (subs[type]==0) Hide(type);

}	


function subover(type) {

 Show(type);

 subs[type]=1;

}



function subout(type) {

 Hide(type);

 subs[type]=0;

}


//-->

[Flitz]

danke schon mal im Vorraus!

Muss das mal im Laufe der Woche ausprobieren...

thx

[computercrustie]

Noch etwas:

Das Menu wird bei Mozilla nicht richtig dargestellt (es geht nicht wieder zu)

Also nur bei IE, NS oder Opera läufts richtig.