[HaBo]

Guyfawkes

Anzeige

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

RemoteC

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

she3p

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:



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

Guyfawkes

Hey!

supercool, danke!

Hab schon einen ersten Test gemacht:

Unbenanntes Dokument

lg