[PaintSplasher]

Einen schönen Guten Tag,

ich bin derzeit an einer Standortkarte zugange.

Zu Testzwecken habe ich unter folgendem Link die abgespeckte
Variante hochgeladen, damit ihr euch ein Bild davon machen könnt.

Zum Problem

Aktiv sind derzeit 2 Punkte, der rote und der blaue direkt nebeneinander
in NRW

Jedes mal wenn man über einen Punkt(Standort) mit der Maus fährt,
soll auf der rechten Seite die Adresse eingeblendet werden. Derzeit
sieht der Code dafür wie folgt aus:

<script type="text/javascript">
//<![CDATA[

function adresse(id) {
     document.getElementById(id).style.visibility="visible";
	 document.onmouseout=function() {
     document.getElementById(id).style.visibility="hidden";
  }
 }

//]]>
</script>

<span id="eins"><img src="karte_rwp_deutschland.gif" alt="Adresse" /></span>
<span id="zwei"><img src="karte_sc_elemente.gif" alt="Adresse" /></span> 
.
.
.

Mein Problem ist derzeit, da es ja einige Standorte sind, werden
am Anfang(sobald man die Seite läd) sofort alle eingebundene
Standorte eingeblendet, dies ist natürlich schlecht.

Weiterhin wird die Adresse sobald man einen anderen Standort
abrufen möchte darunter, und nicht am selben Ort angezeigt.

Daher meine Frage, wie kann ich es lösen dass die Adresse immer
am selben Fleck angezeigt wird, und die eingebundenen Adressen
nicht beim betreten der Seite sichtbar sind.

Sollte der Ansatz wie ich ihn derzeit betreibe totaler humbug ist
und man diesen total anderst lösen sollte, darf es gerne erläutern.

Vielen Dank!

[cgdesign]

Also, erst mal würde ich standardmäßig dem span mit der id eine Klasse mitgeben und dann mit "visibility:hidden" versehen. Somit wird zumindest am Anfang nicht alle Adressen angezeigt. Mit Javascript blendet er beim mouseover ja die Adresse wieder ein. Das löst dein Problem Nr. 1.

Lösung Nr. 2 würde ich schnell so vorschlagen, dass du dem Javascript ja auch noch die Grafik mitgeben könntest und dann nur noch per document.write in ein jeweiliges div reinschreibst.

[PaintSplasher]

Hi,

also ich habe das jetzt folgender massen gelösst.

Und zwar wie folgt:

<span><img src="leer.gif" name="leer" alt="Adresse" width="180" height="96" /></span>

Wie ihr seht habe ich an der Stelle einfach schonmal eine Art
Platzhalter gesetzt in form von einem transparentem pixel

Dieses Bild ersetze ich nun in der area Zone wie folgt:

<map name="mapDeutschland" id="mapDeutschland">
<area shape="rect" coords="39,249,50,259" href="#" onmousedown="document.leer.src='karte_rwp_deutschland.gif';" alt="RWP Deutschland GmbH" title="RWP Deutschland GmbH" />
<area shape="rect" coords="49,249,60,259" href="#" onmousedown="document.leer.src='karte_sc_elemente.gif';" alt="SC Elemente GmbH" title="SC Elemente GmbH" />
</map>

Das alles klappt nun so wie ich es wollte

Allerdings habe ich nun noch ein weiteres Problem, und zwar wird das
attribute name="leer" wohl unter xhtml strict nicht gestattet um das
leer.gif auszutauschen, jemand eine idee?

[cgdesign]

Ok, dann halt anders...

<script type="text/javascript">
//<![CDATA[
function adresse(id)
{
	document.getElementById(id).style.display="block";
	document.onmouseout=function()
	{
		document.getElementById(id).style.display="none";
	}
}
//]]>
</script>
<style type="text/css">
.mapspan {display: none}
</style>

[cgdesign]

Zitat von PaintSplasher

Allerdings habe ich nun noch ein weiteres Problem, und zwar wird das
attribute name="leer" wohl unter xhtml strict nicht gestattet um das
leer.gif auszutauschen, jemand eine idee?

Nimm meine Variante, die funktioniert wenigstens, wenn nicht, arbeite halt mit "id"!

<img src="leer.gif" id="leer" alt="Adresse" width="180" height="96" />

und

document.getElementById('leer').src=...

[PaintSplasher]

Ich danke dir für deine Hilfe! Mit der Übergabe der id funktioniert das ganz ebenso
und ist valid.

Schönen Abend noch.