richtige Schreibweise beachten

[BRo]

Ich benutze den IE gar nicht.. ich benutze Mozilla..
aber ich bin immerhin schon weiter gekommen.
Ich habe schonmal keine Fehlermeldung mehr aber dafür führt Mozilla das nicht richtig aus.
Immer nur ein div wird richtig angezeit, der andere ist entweder komplett schwarz oder orange!!
Ausserdem wird er ,wenn ich runterscrolle so weit wie ich runtergescrollt habe orange (wenn er schwarz ist)

Kann mir das jmd erklären?

MfG BRo
nochmal Quelltext:
<style type="text/css">

div#Seite1 {
position:absolute;
border:dashed red 1px;
width:45em;
height:50em;
background-color:black;
visibility:visible;
top:150px;
left:80px;
}

div#Seite1 h1,h2,h3 {
font-size:2em;
color:red;
text-decoration:underline;
text-align:center;

}

div#Seite2 {
width:45em;
position:absolute;
border:dashed red 1px;
height:50em;
background-color:silver;
visibility:collapse;
top:150px;
left:80px;
}

div#Seite2 h1,h2,h3 {
font-size:2em;
color:red;
text-decoration:underline;
text-align:center;
background-color:blue;
}

div#Seite3 {
width:45em;
position:absolute;
border:dashed red 1px;
height:50em;
visibility:collapse;
top:150px;
left:80px;
background-color:blue;
}

div#Seite3 h1,h2,h3 {
font-size:2em;
color:red;
text-decoration:underline;
text-align:center;
}

</style>
<script type="text/javascript">

function Seite1() {
document.getElementById("Seite2").style.visibility = "collapse";
document.getElementById("Seite3").style.visibility = "collapse";
document.getElementById("Seite1").style.visibility = "visible";
}

function Seite2() {
document.getElementById("Seite2").style.visibility = "visible";
document.getElementById("Seite3").style.visibility = "collapse";
document.getElementById("Seite1").style.visibility = "collapse";

}

function Seite3() {
document.getElementById("Seite2").style.visibility = "collapse";
document.getElementById("Seite3").style.visibility = "visible";
document.getElementById("Seite1").style.visibility = "collapse";

}

</script>