nicht angemeldet
Image maps
suitHi.
Ich habe hier ein Bild mit das ich gemappt habe:
<img src="http://img80.imageshack.us/img80/9356/2punktekz5.jpg" usemap="#2punkte" border="0">
<map name="2punkte">
<area shape="circ" coords="185,62" href="kreis2.php" target="">
<area shape="circ" coords="65,52,18" href="kreis1.php" target="">
</map>
Das Bild aus der Map:
Nun habe ich hier noch ein Bild:
Nun würde ich gerne wissen wie bzw. ob es möglich ist den 2 grünen Kreis aus der Map (<area shape="circ" coords="65,52,18" href="kreis1.php" target="">) mit Javascript und bodyonload auf den roten Kreis zu ändern. Da dies aber meiner Meinung nicht möglich ist würd ich gerne wissen wie ich es bewerkstelligen kann, dass ein div mit dem Bild, oder auch nur das Bild mit den selben Koordinaten (diese wenns geht über document.getElementByName holen).
Der Link sollte dabei nicht verloren gehen.
Kann mir jemand helfen?
-
ggf interessieren dich auch css sprites
damit kann derartiges wesentlich ressourcenschonender umgesetzt werden - auf kreise als klickbaren bereich musst du aber vorerst verzichten - rechtecke oder quadrate wäre möglich
-
ggf interessieren dich auch css sprites
damit kann derartiges wesentlich ressourcenschonender umgesetzt werden - auf kreise als klickbaren bereich musst du aber vorerst verzichten - rechtecke oder quadrate wäre möglich
Auf Kreise kann ich verzichten und Links auch, solange mir ein Bereich bleibt den ich mit einem Mouseover für eventuelle Zusätze versehen kann.
Allerdings bräuchte ich so eine Anleitung wenns geht in Deutsch.
Leider habe ich sowas aber nicht bei selfthml gefunden !?-
ggf interessieren dich auch css sprites
Auf Kreise kann ich verzichten und Links auch, solange mir ein Bereich bleibt den ich mit einem Mouseover für eventuelle Zusätze versehen kann.
dann sind css-sprites das richtige für dich
Allerdings bräuchte ich so eine Anleitung wenns geht in Deutsch.
der ala-artikel ist nicht deutsch, ggf helfen dir die beispiele aber schon weiter (suche einfach nach "example" im text)
ansonsten kannst du noch einen beliebigen web-übersetzungsdienst deiner wahl verwenden
mein rat: versuchs einfach mal, um den artikel zu verstehen muss man nicht unbedingt den text lesen - die beispiele sind aussagekräftig genug
-
Mir scheint ich kann das für meine Zwecke nicht verwenden.
Ich erläutere mal eben meinen genauen Wunsch:
Ich habe eine Karte mit verschiedenen Punkte (Städte).
Alle Punkte haben die Farbe grün und sind fester Bestandteil der Karte (des Bildes). Nun habe ich durch <maps> Links auf die einzelnen Punkte in form eines Quadrates verwiesen. Ich möchte nun mit JS (deswegen auch dieses Unterforum) im bodyonload="function()" eine bestimmte Stadt, sprich einen bestimmten Punkt, sprich eine bestimmte <area ..> mit einem roten Punkt überdecken.
Könnte man das mit hover: bewerkstelligen? Wenn ja wie?Dein gezeigtes scheint mir nicht richtig, oder ich habe es nicht verstanden.
Gibt es eine andere /einfachere/ Möglichkeit?-
eine bestimmte Stadt, sprich einen bestimmten Punkt, ... mit einem roten Punkt überdecken.
Ein etwas anderer Ansatz der dir vllt. helfen könnte:
Definiere die Standardgrafik als Hintergrund (http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=background-image, o.ä.) einer div. Diese div muss mittels css auf http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=position:relative gebracht werden. Anschließend machst du in deiner ein image-Element mit src die transparente Grafik (.gif, .png) deines roten Punktes. Anschließend setzt du das image-Element mittels CSS auf position:absolute und display:none;Wenn du jetzt eine Stadt rot machen willst machst du per JS das display:none wieder weg und mittels http://de.selfhtml.org/css/eigenschaften/positionierung.htm#postop@title=top, http://de.selfhtml.org/css/eigenschaften/positionierung.htm#left@title=right, <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#posbottom@title=bottom >und http://de.selfhtml.org/css/eigenschaften/positionierung.htm#left@title=left positionierst du es am gewünschten Punkt. Die Koordinaten muss du in JS halt wissen.
Könnte man das mit hover: bewerkstelligen? Wenn ja wie?
Dein gezeigtes scheint mir nicht richtig, oder ich habe es nicht verstanden.
Gibt es eine andere /einfachere/ Möglichkeit?-
Thx, diese Möglichkeit erscheint mir viel einfacher und einleuchtender ;)
Danke für eure Hilfe :)-
Thx, diese Möglichkeit erscheint mir viel einfacher und einleuchtender ;)
die andere lösung würde auch ohne javascript (ja sogar ohne stylesheet) funktionieren und ist imho wesentlich einfacher umzusetzen - aber ist deine entscheidung
-
-
-
Könnte man das mit hover: bewerkstelligen? Wenn ja wie?
lies den css sprites artikel (oder lasse ihn dir zur not überstetzen)
-
-
-
-