Hotspots hoverbar machen in dreamweaver

G

Guyfawkes

0
Hey!

Hab gerade auf untenstehendem Link diese geile usemap gesehen. (Auf dem Haus)
The Loree Grand - Apartments

Nun hab ich mir die Frage gestellt, wie ich sowas im Dreamweaver am einfachsten mache.
Die Hotspots hab ich bereits konfiguriert, aber wenn ich per CSS den a:hover anwende, dann passiert beim hovern gar nichts.

Und interessanterweise ist auf obenstehender Webpage jedes Geschoss in einem einzelnen bild wenn man firebugged, kapier ich aber nicht ganz, da slices ja nur rechteckig sein dürfen oder?

lg ben
 
Das ganze funktioniert nicht mit CSS sondern mit einem JS (onMouseOver) und einer image-map: Wenn du über einen bestimmten Bereich über das Bild fährst (als Polygon definiert, also nicht rechteckig) versteckt sich dahinter der Link und dem Link ist das JS zugewiesen welches die gesamte Grafik ändert, nicht nur den Bereich der hervorgehoben wird. Nachdem der Rest gleich bleibt schaut es so aus als ob sich nur der eine Stock ändert.

z.B. Grafik für den 4th floor: http://www.loreegranddc.com/images/Fp_rendering_4.jpg und 5th: http://www.loreegranddc.com/images/Fp_rendering_5.jpg

Nachdem ich nicht genau weiß was dein Problem ist hier noch eine Beschreibung der image-map: SELFHTML: HTML/XHTML / Grafiken / Verweis-sensitive Grafiken (Image Maps)

... und des JS "onMouseOver": Der Mouseover Effekt - onmouseover javascript beispiele script java scripte mouse-over mouse over mausover
 
Code: 
a:hover
wird nicht funktionieren, da Usemaps keine Linktags erzeugen. Es ist meines Wissens nicht möglich, eine Usemap (auch keine area's) per CSS zu stylen.
Auch beim genannten Beispiel ist das Unterfangen mit Javascript gelöst. Beim hover über eine Area wird einfach das Bild ausgewechselt. Sieht man schön, wenn man sich die Bilder aus der Funktion MM_swapimage mal ansieht:

Fp_rendering_6.jpg


Und nein, shapes müssen nicht rechteckig sein. In einer HTML-Dokumentation findest du die verschiedenen Möglichkeiten; rect für Rechtecke, poly für beliebige Polynome oder circle für Kreise.

// edit: tja, langsamer ;)
 
Um antworten zu können musst du eingeloggt sein.
Zurück
Oben