Erstellung eines Java-Scripts

[Ramses2]

Ein freundliches "Hallo" an Alle, die hier helfen!

Ich hab da ein Problem (klar, sonst wäre ich ja nicht hier :-))!

Ich bin dabei eine Homepage zu erstellen, die von der Gestaltung her oben, links, rechts und unten aus einzelnen Grafiken besteht, der mittlere Teil ist ein iframe. In diesen Grafiken sind "Kreise" vorhanden, die einen Mouse-over-Effekt bekommen sollen. Hier mal ein Bild, welches die Ausgangsbasis darstellt:

Beim überfahren mit der Maus ändert sich das Aussehen der Kugel und ein Text erscheint, der diesen Link beschreibt, wobei der Hintergrund des Textes und dessen Farbe farblich an die Homepage angepasst sein soll. Beim anklicken deer Kugel soll dann auf die entsprechende Seite gelinkt werden, die dann im iframe angezeigt wird.

Dieser Effekt soll mit einem Java-Script gemacht werden - und ich habe von Java absolut überhaupt keine Ahnung. Kann mir Jemand helfen, ein solches Script zu schreiben?

Für Eure Hilfe danke ich bereits im Voraus und grüße herzlich
Ramses2

[ritschmanhard]

Hi Ramses2!

Ohne zu meckern, ein paar Hinweise:

1. Wichtige Unterscheidung: Javascript ist nicht Java und um einiges leichter zu handhaben.

2. Nu is das ja so hier: man bekommt gerne Hinweise, wie man konkrete Probleme löst, aber eigentlich nie "Komplettlösungen". Solltest du also dein Vorhaben weiter realisieren wollen, so müßtest du schon selbst Javascript lernen (wollen) und dann mit konkreten Fragen hier auflaufen.

3. Und nun einige Tips für den Einstieg:
   Empfohlene Javascript Tutorials
   <http://de.selfhtml.org/navigation/syntax.htm#javascript@title=Javascript Syntaxverzeichnis>
   Ein Beispiel, das in Richtung "Linkbeschreibung" geht

Wenn die Javascript gelernt hast, wird es dich selbst freuen.

Viele Grüße,
Richard

[Peter Pan]

Hi!

Wenn die Javascript gelernt hast, wird es dich selbst freuen.

Ich dachte immer es heißt _das_ Javascript.

off:PP

[ritschmanhard]

Hi Peter,

sollte eigentlich "du" heißen - denn auch:

Wenn das Javascript gelernt hast, wird es dich selbst freuen.

ist nicht wirklich prickelnd.
Ansonsten hast du schon recht...

Grüße,
Richard

[Ramses2]

Hallo Richard,

auch an Dich geht mein herzlicher Dank.

Allerdings hatte ich nicht vor, einzig und alleine wegen diesem Problem gleich Java zu erlernen ;-). Bisher hab ich es noch nicht gebraucht - und ich hab schon etliche Pages erstellt.

Jedoch habe ich gesehen, dass einer Deiner Hinweise doch recht hilfreich sein könnte. Das kann ich aber erst "bewerten", wenn ich es ausprobiert habe ;-) - mal sehen, was dabei raus kommt.

Vielen Dank für die Tipps!

LG
Ramses2

[EKKi]

Mahlzeit Ramses2,

Allerdings hatte ich nicht vor, einzig und alleine wegen diesem Problem gleich Java zu erlernen ;-).

Zitat 141

MfG,
EKKi

[molily]

Hallo,

Dieser Effekt soll mit einem Java-Script gemacht werden

Warum? Warum nicht mit CSS?
Du kannst z.B. a-Elemente entsprechend absolut positionieren, sodass sie als Rechtecke über den Kugeln liegen. Beim :hover wird das Hintergrundbild geändert und der Text eingeblendet. Schematisch:

<a href="..." id="link1"><span>Text</span></a>

#link1 {  
   display:block;  
   width:...px;  
   height:...px;  
   position:absolute;  
   top:...px;  
   left:...px;  
}  
#link1:hover {  
   background-image:url(kugel_hervorgehoben.png);  
   background-position:center left;  
   background-repeat:none;  
   /* usw. */  
}  
#link1 span {  
   text-indent:-9999px; /* ausblenden */  
}  
#link1:hover span {  
   text-indent:0; /* einblenden */  
   padding-left:...px;  
   /* eventuell noch positionieren mit position:absolute oder position:relative */  
}

Selbst wenn du die Ein- und Ausblenden-Logik mit JavaScript löst, wäre es sinnvoll, Elemente über die Kugeln zu legen. Eine JavaScript-Lösung würde also dieselbe Grundlage haben.

Mathias

[Ramses2]

Hallo Mathias,

erst mal meinen herzlichen Dank für Deinen Tipp. Ich werde es einfach mal ausprobieren, da ich mich mit CSS besser auskenne, als mit Java!

LG
Ramses2

[EKKi]

Mahlzeit Ramses2,

Ich werde es einfach mal ausprobieren, da ich mich mit CSS besser auskenne, als mit Java!

Zitat 141

MfG,
EKKi