mouseover bei imagemap
Andi
- javascript
HAllo,
Ich habe ein Problem.
Ich Habe ein Imagemap und möchte das wenn man mit der maus auf ein link (<area bla bla bla>) geht das dann ein anderes Bild eingeblendet wird.
Dynamische Buttons halt. Gibt es eine Möglichkeit auser Layer?
hi andi!
versuch's mal so (in jeden <area>-tag einfügen):
onmouseover="document.images[nummer].src='neues_bild.jpg'"
onmouseout="document.images[nummer].src='altes_bild.jpg'"
das wär's eigentlich schon.
gruß, maniac
Klappt leider nicht!
Es Passiert gar nichts.
hi andi,
dann poste hier mal den quelltext. vielleicht kann ich dir dann weiterhelfen!
gruß, maniac
<img src="images\imagemap.jpg" width=786 height=406 border=0 usemap="#imagemap">
<map name="imagemap">
<area shape="rect" coords="76,48,210,70" onMouseover="document.images[1].src='../images/index/ueber_uns_yellow.jpg';" onMouseout="document.images[1].src='../images/index/ueber_uns.jpg" href="ueber_uns.php4">
<area shape="rect" coords="534,47,715,69" onMouseover="document.images[2].src='../images/index/weiter_yellow.jpg';" onMouseout="document.images[2].src='../images/index/weiter.jpg" href="ueber_uns.php4">
</map>
So hier mein Quelltext!
hi andi!
1.
<img src="images\imagemap.jpg" width=786 height=406 border=0 usemap="#imagemap">
a) es darf kein backslash sondern muss ein slash sein:
<img src="images/imagemap.jpg" ...
b) der verweis auf die imagemap muss nach der definition dieser stehen, d.h. der <img>-tag kommt hinter den <map>-tag
c) bist du sicher, dass das ursprungsbild "imagemap.jpg" heisst?
2.
<map name="imagemap">
<area shape="rect" coords="76,48,210,70" onMouseover="document.images[1].src='../images/index/ueber_uns_yellow.jpg';" onMouseout="document.images[1].src='../images/index/ueber_uns.jpg" href="ueber_uns.php4">
a) ist das bild "imagemap.jpg" das erste bild, dass in deiner seite geladen wird, muss es document.images[0] heissen, ist es das zweite dann document.images[1] usw.
b) beim onmouseover ist das ; am ende (zwischen ' und ") überflüssig
c) beim onmouseout fehlt ein ' zum abschluss des dateinamens
d) es fehlt der schliessende </area>-tag
3.
<area shape="rect" coords="534,47,715,69" onMouseover="document.images[2].src='../images/index/weiter_yellow.jpg';" onMouseout="document.images[2].src='../images/index/weiter.jpg" href="ueber_uns.php4">
siehe 2.
und weil ich hier auf der arbeit eh nix zu tun hab das ganze einmal korrigiert:
<map name="imagemap">
<area shape="rect" coords="76,48,210,70" onMouseover="document.images[0].src='../images/index/ueber_uns_yellow.jpg'" onMouseout="document.images[0].src='../images/index/ueber_uns.jpg'" href="ueber_uns.php4">
</area>
<area shape="rect" coords="534,47,715,69" onMouseover="document.images[0].src='../images/index/weiter_yellow.jpg'" onMouseout="document.images[0].src='../images/index/weiter.jpg'" href="ueber_uns.php4">
</area>
</map>
<img src="images/imagemap.jpg" width=786 height=406 border=0 usemap="#imagemap">
nu müssts klappen.
gruß, maniac
Hmmmm,
Ich glaub ich weis jezt wo der Fehler liegt.
Was Ich meine Ist das sich beim mouseover nur ein Bild Über den mit coords angegebenen Bereich ein Bild legt, des Gesamt Bild aber bleibt!
Wenn Ich es so mache wie du es mir Sagst dann Ändert sich das Ganze Bild! Dann müsste Ich das Bild ja in 1000 verschiedenen Varianten Laden!
Das soll so nicht sein.
Gibs denn da ne Möglichkeit? Oder muss Ich da dann doch mit Layer arbeiten?
ah sooo...
nu, wie das mit den layern geht, weiss ich selber garnich. ich würds so machen:
ein hintergrundbild, dass die komponenten zeigt, die immer gleich bleiben.
mehrere einzelbilder mit den komponenten, die sich ändern. und diese dann mit dem schönen onmouseover - onmouseout per mausbewegung aufleuchten lassen.
na denne, viel spaß noch beim tüfteln!
gruß, maniac
Na dann...
vielen Dank für die Mühe-
by Andi
Ich Habe ein Imagemap und möchte das wenn man mit der maus auf ein link (<area bla bla bla>) geht das dann ein anderes Bild eingeblendet
hallo,
vielleicht kannst du ja anstatt dem img-map auch einzelbilder nehmen, die dann, in einer tabelle zusammengerückt, wie ein bild aussehen.. dann is das mit dem onmouseover ganz simpel.
ein programm, welches ein bild einfach zerschneidet und dir sogar noch den html code generiert ist -> picture dicer - fa. weis ich nicht, aber google sollte da auskunft geben - denke es ist freeware.
gruss
moejoe