chiefsoleil
Grünschnabel
Hallo Allerseits
Ich bin ein JavaScript-Neuling und versuche verzweifelt mit dem folgenden Code einen Rollovereffekt bei mehreren Bildern zu generieren. Die Idee dahinter ist, dass zwei Buttons jeweils ausgetauscht werden bei onmouseover und wieder zurück bei onmouseout und dass gleichzeitig ein drittes Bild "holder" erscheint, resp. wieder verschwindet... bis jetzt habe ich nur erreicht, dass der erste button zwar bei onmouseover wechselt aber bei onmouseout wechselt der button nicht mehr zurück und der Rest (2. button und 3. Bild) funktioniert gar nicht... kann mir da jemand weiterhelfen?!
hier der Code:
Vielen Dank schonmal im Voraus!!
Ich bin ein JavaScript-Neuling und versuche verzweifelt mit dem folgenden Code einen Rollovereffekt bei mehreren Bildern zu generieren. Die Idee dahinter ist, dass zwei Buttons jeweils ausgetauscht werden bei onmouseover und wieder zurück bei onmouseout und dass gleichzeitig ein drittes Bild "holder" erscheint, resp. wieder verschwindet... bis jetzt habe ich nur erreicht, dass der erste button zwar bei onmouseover wechselt aber bei onmouseout wechselt der button nicht mehr zurück und der Rest (2. button und 3. Bild) funktioniert gar nicht... kann mir da jemand weiterhelfen?!
hier der Code:
HTML:
<html>
<head>
<title>Untitled Document</title>
<script language="javascript">
<!--
if (document.images) {
// "over"-images
img1on = new Image();
img1on.src = "nav_over.gif";
img2on.src = new Image();
img2on.src = "nav_over.gif";
// "out"-images
img1off = new Image();
img1off.src = "nav.gif";
img2off = new Image();
img2off.src = "nav.gif";
//lesson number info
img1info = new Image();
img1info.src = "l1.gif"
img2info = new Image();
img2info.src = "l2.gif"
}
//mouseover
function imgOn(imgName) {
if (document.images) {
document.images[imgName].src = eval(imgName + "on.src");
document.images["holder"].src = eval(imgName + "info.src");
}
}
//mouseout
function imgOff(imgName) {
if (document.images) {
document.images[imgName].src = eval(imgName + "off.src");
document.images["holder"].src = "blank.gif";
}
}
//-->
</script>
</head>
<body>
<a href="test.html"
onMouseOver="imgOn('img1')"
onMouseOut="imgOff('img1')">
<img name="img1" border="0" height="40" width="20" src="nav.gif"></a>
<a href="test2.html"
onMouseOver="imgOn('img2')"
onMouseOut="imgOff('img2')">
<img name="img2" border="o" height="40" width="20" src="nav.gif"></a>
<img name="holder" height="40" width="71" src="blank.gif">
</body>
</html>Vielen Dank schonmal im Voraus!!
