Gibt es eine Möglichkeit, eine Hintergrundfarbe für das HTML-Element <area>
festzulegen? Ich erstelle eine Imagemap, in der bestimmte Abschnitte der Map einen Tooltip anzeigen, wenn Sie mit der Maus darüber fahren. Ich dachte, es wäre cool (und praktisch), wenn ich eine Hintergrundfarbe für die <area>
-Elemente festlegen könnte, damit Sie sehen können wo sie sich über dem Bild befanden.
Ich habe sowohl die Hintergrundfarbe als auch die Rahmenfarbe ausprobiert und habe auch keine Auswirkungen - die <area>
-Elemente bleiben "unsichtbar". Ich nehme an, das liegt daran, dass <area>
ein sich selbst schließendes Tag ist und daher eigentlich keine Dimensionen hat. Aber das Erzwingen von Höhe und Breite half auch nicht.
sie können div(set postition:absolute)
anstelle von area verwenden
Es scheint nicht möglich zu sein.
Vielleicht möchten Sie in dieses jQuery-Plugin schauen:
http://plugins.jquery.com/project/maphilight
Hier ist ein Beispiel:
<script>
$(function()
{
$('.map').maphilight({
fillColor: '008800'
});
var data = $('#id').data('maphilight') || {};
data.alwaysOn = !data.alwaysOn;
$('#id').data('maphilight', data).trigger('alwaysOn.maphilight');
});
Es gibt zwei Bibliotheken, die diese Funktion bereitstellen. Beide arbeiten auf die gleiche, nicht triviale Weise, indem sie prüfen, ob der Browser Canvas unterstützt. Wenn dies der Fall ist, zeichnen Sie eine Canvas-Form und, falls dies nicht der Fall ist (d. H. Internet Explorer), VML.
Es gibt einige ziemlich gute Demos auf der ImageMapster Site.