Button mit Pop-up Fenster

S

salsagreen

Mitglied
Thread Starter
Dabei seit
25.01.2004
Beiträge
22
Reaktionspunkte
0
Hallo,

ich möchte ein Button erstellen für eine Navigation.
Ich bekomme das nicht hin und frage, ob jemand ein einfaches Tutorial hat. Button mit Roll Over soll aussehen wie z.B. www.allianz.de dort mit der maus über "Das Unternehmen" gehen. Es folgt ein Pop-Up mit Untermenüs.

Bitte um Hilfe!
Danke
salsagreen
 
Ist mit Flash gemacht.

auf Flashworker.de gibts eine menge dieser Tutorials.
 
Sicher?

Also, normalerweise kommt bei Flash - rechte Maustaste die Info - hier nicht.... geht das nicht anders. Ich meine ich habe auch kein Flash.....

Danke
 
Hallo,

es könnte auch eine Seite mit Javascript sein und der Funktion irgendwie OnMouse Rollover.

Viele Grüße
Michael
 
das is kein flash, das is simples javascript.

das prinzip:

1. erstelle eine ("kategorie")-ebene, über die per mouse-over was passieren soll, positionier sie, stell bei mouseover den background/text zb auf ne andere farbe, zeige die aufzuklappende andere ebene und einiges anderes:

PHP: 
<div class=kategorie  style='position:absolute; left:100; top:10; width:100; height:20; cursor:default;' onMouseOver="zeige('ebene01'); this.style.backgroundColor='#000000'; this.style.color='#ffffff'"  onMouseOut="verstecke('ebene01'); this.style.backgroundColor='#00ff00'; this.style.color='#000000'">
Das Unternehmen
</div>

2. die aufzuklappende ebene namens "ebene01" ebenfalls als <div> erstellen und mittels css per default auf unsichtbar stellen:

PHP: 
<div name=ebene01 id=ebene01 style='position:absolute; left:100; top:30px; width:100; border: 1px #000000 solid; visibility:hidden; cursor:default;'" onMouseOut="verstecke('ebene01');">
<a href="..">Hier der Link1</a><br>
<a href="..">Hier der Link2</a><br>
<a href="..">usw.</a>
</div>

und als 3. noch die verwendeten javascript-funktionen zeige() und verstecke(). hier eine variante, die zwischen verschiedenen browsern unterscheidet, da diese nötige javascript-befehle etwas unterschiedlich umsetzen und man das abfangen muss:

PHP: 
<SCRIPT LANGUAGE="JavaScript">

// hier schau ich, was für einen browser der user hat: 
var ie  = navigator.appName == "Microsoft Internet Explorer"; 
var op  = navigator.userAgent.indexOf('Opera') != -1; 
var ns6 = navigator.appName == "Netscape" && navigator.appVersion.substring(0,1) > "4"; 
var ns4 = navigator.appName == "Netscape" && navigator.appVersion.substring(0,1) == "4"; 
var mac = window.navigator.platform == "MacPPC" && navigator.appVersion.substring(0,1) == "4";  

// mit dieser funktion kann ich ein bestimmtest element anzeigen 
function zeige(element) { 	
  // falls internet explorer, mit DIESEM befehl anzeigen 	
  if (ie) { 		
    document.all[element].style.visibility="visible"; 	
  }  	
  // falls netscape oder opera, mit DIESEM befehl anzeigen, 		
  if (ns6 || op) { 		
    document.getElementById(element).style.visibility="visible"; 	
  }  	
  //falls netscape 4.x .. geht nix! (weil netscape 4.x sowas gar nicht kann) 
}  

// mit dieser funktion kann ich ein bestimmtest element VERSTECKEN 
function verstecke(element) { 
  // falls internet explorer, mit DIESEM befehl anzeigen 	
  if (ie) { 		
    document.all[element].style.visibility="hidden"; 	
  }  	
  // falls netscape oder opera, mit DIESEM befehl anzeigen, 		
  if (ns6 || op) { 		
    document.getElementById(element).style.visibility="hidden"; 	
  }  	
  //falls netscape 4.x .. geht nix! (weil netscape 4.x sowas gar nicht kann) 
} 
</SCRIPT>
 
Vielen Dank!

ist doch umfangreicher wie ich dachte ;-((
PHP/ Java Script/ etc.......

Puhhh - wo trage ich denn das ein? Auf der html Seite? Kann ich dafür
GoLive oder Dreamweaver verwenden oder ist das ein Zusatz-Text-File?

Sorry, aber ich will das wirklich mal ausprobieren!

Danke
salsagreen
 
nein, mit php hat das nichts zu tun! ich hab das nur hier als "php-code" dargestellt, weils so schönes syntax-highlighting gibt.

erstell ein grundgerüst einer html-datei und kopier die obigen sdachen dann alle 3 irgendwohin in den <body> .. </body> bereich. sollte eigentlich funktionieren, ausser ich hab mich irgendwo etwas vertippt
 
ein kleiner fehler war noch drin, hab dir das ganze mal als komplette html-datei erstellt. das is eben auf simpelste weise realisiert, ginge bestimmt noch anders, effektiver oder wie auch immer ;)

bitteschön:
 
Super!

Das hilf mir schon sehr viel weiter - ich werde mich mal an die Grafiken ranmachen!

Merci
salsagreen
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten