Mouseover über Textlink für Bildanzeige
Kongo
- javascript
Hallo, ich habe ein folgendes Problem:
Ich möchte, daß bei Textlinks per Mouseover jeweils unterschiedliche Bilder an einer bestimmten Position angezeigt werden, zusätzlich werden die Textlinks verlinkt, Bsp.:
Textlink 1 --> bild1
Textlink 2 --> bild2
usw.
Ich habe hier im Forum einen Code für einen Link gefunden, also habe ich einen Code für den zweiten Textlink nach meiner Logik eingegeben. An sich funktioniert das auch. Allerdings werden die Links / die Bilder gemeinsam angesprochen, d.h. beim rüberfahren auf Textlink 1 und Textlink 2 zeigen sich beide Bilder gleichzeitig (bild1 und bild2).
Habe ich bei der Id was falsch eingegeben, oder wo liegt das Problem?
Vielen Dank! : )
--------------
<html>
<head>
<title>..</title>
<script type="text/javascript">
<!--
function LM(anzeige) {
document.getElementById("bild1").style.visibility = anzeige;
document.getElementById("bild2").style.visibility = anzeige;
}
//-->
</script>
</head>
--------------
<table>
<tr>
<td onMouseOver="LM('visible')" onMouseOut="LM('hidden')"><a href="Seite1.html">Textlink 1</a></td>
<td><img id="bild1" style=" width: 50; height: 50; left: 40%; top:50%; position: absolute; visibility: hidden" src="./2.gif">
<td onMouseOver="LM('visible')" onMouseOut="LM('hidden')"><a href="Seite2.html">Textlink 2</a></td>
<td><img id="bild2" style=" width: 50; height: 50; left: 40%; top:50%; position: absolute; visibility: hidden" src="./2.gif">
</tr>
</table>
--------------
Die Bilder sollen natürlich
..src="1.gif"> und ...src="2.gif">
heissen..
so scheint es also zu funktionieren:
----------
<script type="text/javascript">
<!--
function LM(anzeige) {
document.getElementById("bild1").style.visibility = anzeige;
}
function LM2(anzeige) {
document.getElementById("bild2").style.visibility = anzeige;
}
//-->
</script>
-----------
<table>
<tr>
<td onMouseOver="LM('visible')" onMouseOut="LM('hidden')"><a href="Seite1.html">Textlink 1</a></td>
<td><img id="bild1" style=" width: 50; height: 50; left: 40%; top:50%; position: absolute; visibility: hidden" src="1.gif">
<td onMouseOver="LM2('visible')" onMouseOut="LM2('hidden')"><a href="Seite2.html">Textlink 2</a></td>
<td><img id="bild2" style=" width: 50; height: 50; left: 40%; top:50%; position: absolute; visibility: hidden" src="2.gif">
</tr>
</table>
--------------