hubschraubaer: Problem mit OnMouseOver

Beitrag lesen

Hi!
Ich habe ein Bild verlinkt. Dieses Bild (border_right) soll bei OnMouseOver das nächste Bild (next1) anzeigen. Bei OnMouseOut soll wieder "border_right" angezeigt werden. Und wenn man auf "next1" klickt, soll "next2" angezeigt werden. Bei OnMouseOut soll wieder "border_right" angezeigt werden. Soweit klappt das auch.
Aber beim nächsten OnMouseOver sollte eigentlich wieder das Bild "next2" angezeigt werden. Doch das passiert nicht. Statt dessen wird "next1" angezeigt.

Ich bin kurz davor durchzudrehen, weil ich den Fehler einfach nicht finde :-!

Hier noch der Grund für meine Verzweiflung:

<html>
<head>
 <title>Untitled</title>
<script type="text/javascript">

function next_visible_eins() {
 document.getElementById("border_right").style.display = "none";
 document.getElementById("next1").style.display = "inline";
}
function next_unvisible_eins() {
 document.getElementById("border_right").style.display = "inline";
 document.getElementById("next1").style.display = "none";
}
function next_visible_zwei() {
 document.getElementById("next2").style.display = "inline";
 document.getElementById("border_right").style.display = "none";

}
function next_unvisible_zwei() {
 document.getElementById("next2").style.display = "inline";
 document.getElementById("next1").style.display = "none";
 document.getElementById("border_right").style.display = "inline";
 document.getElementById("next2").style.display = "none";
}

</script>
</head>

<body>
 <img src="border.png" id="border_right" width="96" height="544" alt="border_right" style="display:block; border:none; margin:0; padding:0;" onmouseover="next_visible_eins()">

<a href="#"><img src="next1.png" id="next1" width="96" height="544" alt="next1" style="display:none; border:none; margin:0; padding:0;" onclick="next_visible_zwei()" onmouseover="next_visible_eins()" onmouseout="next_unvisible_eins()"></a>

<a href="#"><img src="next2.png" id="next2" width="96" height="544" alt="next2" style="display:none; border:none; margin:0; padding:0;" onmouseover="next_visible_zwei()" onmouseout="next_unvisible_zwei()"></a>
</body>
</html>

Vielen Dank für eure Antworten!!!
Mit freundlichen Grüßen
ciao, hubschraubaer