nicht angemeldet
imagemap und "Dynamische grafische Buttons"
Hallo.
Ich habe eine Imagemap erstellt und möchte dann bei einem Verweis (der durch die imagemap definiert ist) einen onmouseover und onmouseout Event-händler einbauen um dynamisch grafische buttons benutzen zu können. Ausserdem ist die postition des image, dass ich ersetzen möchte durch einen <div> bereich festgelegt.
wie muss der quellcode jetzt lauten?
so ungefair stell ich mir das dann vor (ich lasse jetzt einfach mal alles unnötige weg)
<script type="text/javascript">
<!--
Normal1 = new Image();
Normal1.src = "menu1.gif"; /* erste Standard-Grafik */
Highlight1 = new Image();
Highlight1.src = "highlight1_menu1.gif"; /* erste Highlight-Grafik */
/* usw. fuer alle weiteren zu benutzenden Grafiken */
function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
//-->
</script>
//und dann weiter unten, in einer tabelle:
<tr>
<td colspan=6>
<img src="oben.gif" width="1009" height="177" alt="" border="0" align=""></td>
</tr>
<tr>
<td width=33px><map name="menu1">
<area shape="poly" coords="236,175,229,180,234,189,324,209,337,199" href="art.htm" alt="Art" onMouseOver="Bildwechsel(0,Highlight1)"
onMouseOut="Bildwechsel(0,Normal1)">
<area shape="poly" coords="351,78,355,171,368,180,366,77,358,71" href="misc.htm" alt="Misc.">
</map>
<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
</td></tr>
das problem bei diesem versuch ist, dass dann nicht das bild, dass ich ersetzen wollte ersetzt wird, sondern ein anderes bild das in der tabellenzeile über der imagemap definiert ist.
wer kann mir helfen??
-
Hi,
<area shape="poly" coords="236,175,229,180,234,189,324,209,337,199" href="art.htm" alt="Art" onMouseOver="Bildwechsel(0,Highlight1)"
onMouseOut="Bildwechsel(0,Normal1)">Bildwechsel(0,Normal1) --> nimm statt der Null den Namen des Bildes, das du ersetzen möchtest!
<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
</td></tr>Hier noch den name ins img-tag: <img name="blabla"...>
Christian
-
Hi,
<area shape="poly" coords="236,175,229,180,234,189,324,209,337,199" href="art.htm" alt="Art" onMouseOver="Bildwechsel(0,Highlight1)"
onMouseOut="Bildwechsel(0,Normal1)">Bildwechsel(0,Normal1) --> nimm statt der Null den Namen des Bildes, das du ersetzen möchtest!
<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
</td></tr>Hier noch den name ins img-tag: <img name="blabla"...>
Christian
sorry, scheind irgendwie auch nicht zu gehen.
-
Hi,
sorry, scheind irgendwie auch nicht zu gehen.
muss doch irgendwie gehen!
nimm mal den Code hier (hab deinen etwas umgeschrieben):
<script type="text/javascript">
<!--
Normal1 = new Image();
Normal1.src = "menu1.gif"; /* erste Standard-Grafik */
Highlight1 = new Image();
Highlight1.src = "highlight1_menu1.gif"; /* erste Highlight-Grafik *//* usw. fuer alle weiteren zu benutzenden Grafiken */
function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
//-->
</script>//und dann weiter unten, in einer tabelle:
<tr>
<td colspan=6>
<img src="oben.gif" width="1009" height="177" alt="" border="0" align=""></td>
</tr>
<tr>
<td width=33px><map name="menu1">
<area shape="poly" coords="236,175,229,180,234,189,324,209,337,199" href="art.htm" alt="Art" onMouseOver="Bildwechsel('meinBild',Highlight1)"
onMouseOut="Bildwechsel('meinBild',Normal1)">
<area shape="poly" coords="351,78,355,171,368,180,366,77,358,71" href="misc.htm" alt="Misc.">
</map><div style="position:absolute; top:237px; left:577px;"><img name="meinBild" src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
</td></tr>Gruß
ChristianPS: <td width=33px> ist nicht ganz korrekt: entweder <td width="33"> oder <td style="width:33px">
-
Danke für deine Hilfe. aber ich habe das nun schon mit hilfe eines anderen antworters gelöst. es lag schon an der 0, aber sie musste in eine andere Nr umgeschrieben werden, so dass es der zahl des bildes entspricht.
danke wegen dem hinweis wegen den px.
-
-
-
-
Hallo.
Hallo
<script type="text/javascript">
<!--
Normal1 = new Image();
Normal1.src = "menu1.gif"; /* erste Standard-Grafik */
Highlight1 = new Image();
Highlight1.src = "highlight1_menu1.gif"; /* erste Highlight-Grafik *//* usw. fuer alle weiteren zu benutzenden Grafiken */
function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
//-->
</script>//und dann weiter unten, in einer tabelle:
<tr>
<td colspan=6>
<img src="oben.gif" width="1009" height="177" alt="" border="0" align=""></td>
</tr>
<tr>
<td width=33px><map name="menu1">
<area shape="poly" coords="236,175,229,180,234,189,324,209,337,199" href="art.htm" alt="Art" onMouseOver="Bildwechsel(0,Highlight1)"
onMouseOut="Bildwechsel(0,Normal1)">
<area shape="poly" coords="351,78,355,171,368,180,366,77,358,71" href="misc.htm" alt="Misc.">
</map><div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
</td></tr>das problem bei diesem versuch ist, dass dann nicht das bild, dass ich ersetzen wollte ersetzt wird, sondern ein anderes bild das in der tabellenzeile über der imagemap definiert ist.
mit document.images[x] wird die x. Grafik im Dokument angesprochen. Wenn du also document.images[0] schreibst sprichst du die erste grafik im dokument an. In deinerm Fall müsstest du mit Bildwechsel(1,Highlight1) anfangen. und ab dort weiterzählen. Bildwechsel(1,Normal1), Bildwechsel(2,Highlight2), Bildwechsel(2,Normal2), ...
Musst einfach zählen, das wievielte Bild im Dokument es ist, das du wechseln möchtest... ;-)
Philip
-
hi!
stimmt. die 0 bezieht sich auf das erste bild.
das problem ist jetzt allerdings, das anscheinend das bild<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
nicht mitgezählt wird. das bild erhält anscheinend keine nummer :-(
also geht das leider auch nicht...
-
hi!
stimmt. die 0 bezieht sich auf das erste bild.
das problem ist jetzt allerdings, das anscheinend das bild<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
nicht mitgezählt wird. das bild erhält anscheinend keine nummer :-(
Das Bild hat auf jeden Fall ne Nummer. Musst halt nur zählen, das wievielte Bild es ist.
Philip
-
hi!
stimmt. die 0 bezieht sich auf das erste bild.
das problem ist jetzt allerdings, das anscheinend das bild<div style="position:absolute; top:237px; left:577px;"><img src="menu1.gif" width="383" height="217" alt="" border="0" align="" usemap="#menu1"></div>
nicht mitgezählt wird. das bild erhält anscheinend keine nummer :-(
Das Bild hat auf jeden Fall ne Nummer. Musst halt nur zählen, das wievielte Bild es ist.
Philip
Du hast recht!! schoenen dank! ich war nur so bloed und habe bei dem ausprobieren nur bei dem onmouseout die 0 geändert.
danke.
mr Mister
-
-
-