Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 11.03.2011, 15:57
freejay freejay ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.08.2010
Beiträge: 21
freejay befindet sich auf einem aufstrebenden Ast
Standard Profifrage: Imagemap auf div mit background-image?

Hi,

ich habe einen sehr komplizierten Fall und wollte mal fragen ob meine Gedanken dazu sinnvoll sind.

Situation:
Ich habe eine Page mit Characters (Figuren) die natürlich nichtmal annähernd ein eckiges Shape haben.
Die Characters liegen in einem div und sind als background-image definiert.
Aktuell ist es so, dass wenn man über das div hovert, per javascript im hintergrund ein weiteres div eingeblendet wird, mit dem die figuren ein "outline" erhalten. Außerdem sind die divs verlinkt. bzw. es befindet sich ein <a> in entsprechender div größe darin mit Link.

Zukünftig soll nun exakt das Shape der Charaktere verlinkt sein u. der hover effekt (mit outline) dann auch nur beim hovern über genau den shape der charaktere gelegt werden.
D.h. die Verlinkung und der entsprechende Hover effekt finden nur innerhalb der umrisse der charaktere statt.

Das kann man nur mit einer image map lösen, sehe ich das richtig?
Sehe ich es richtig dass ich mir dann in adobe fireworks meine imagemap erstelle, zusätzlich ein dummy-img erstellen muss (in größe des divs bereichs, in dem dann die imagemap liegen soll), das dummy-image setze ich auf visibility hidden und dann habe ich nur den shape der imagemap vorhanden der auf meinem div mit dem background image liegt und kann dann der imagemap eine klasse geben, um schließlich auch in javascript usw. den shape für den hover (mouseover) effekt zu nutzen und zu verlinken usw.?

Ich hoffe meine problemstellung kommt klar rüber

Danke für eure Tipps schonmal im voraus

Geändert von freejay (11.03.2011 um 16:00 Uhr)
Mit Zitat antworten
Sponsored Links