OnMouseOver - Style eines Elements

[Jeremy]

Noch mal allgemeines Feedback:

Nach euren zahlreichen Tipps und Tricks war es mir möglich, den Quelltext so anzupassen, dass das Javascript funktioniert.
Vielen Dank! Im Anschluss werde ich den nun korrekten Code anfügen - als Lernbeispiel, falls jemand ähnlich doof sein sollte wie ich. ;)

Liebe Grüße, Jeremy.

  
<div  style="width:100%;">  
<ul>  
<li onmouseover="contentchange('zwo8','zwo9','zwo10');">2008</li>  
<li onmouseover="contentchange('zwo9','zwo8','zwo10');">2009</li>  
<li onmouseover="contentchange('zwo10','zwo8','zwo9');">2010</li>  
</ul>  
<div style="background-color:#ff6600;visibility:hidden;" id="zwo8">  
  Foo  
</div>  
<div style="background-color:#ff6600;visibility:hidden;" id="zwo9">  
  Bar  
</div>  
<div style="background-color:#ff6600;visibility:hidden;" id="zwo10">  
  Lorem Ipsum  
</div>  
</div>  

  
<script type="text/javascript">  
function contentchange(container1,container2,container3) {  
document.getElementById(container1).style.visibility='visible';  
document.getElementById(container2).style.visibility='hidden';  
document.getElementById(container3).style.visibility='hidden';  
  
}  
</script>  

Meine Fehler waren also:

• Bezeichnung eine List-Items als Link,
• ungültige ID,
• vergessene Anführungszeichen in den Parametern der Funktion,
• Benutzung von "javascript:" im Eventhandler onmouseover,
• Missachtung von Groß- und Kleinschreibung bei document.getElementById(),
• überflüssige Farbgebungen im Style der Div-Elemente.

Vielen Dank an alle helfenden Hände! :)

PS: optional können für die Container auch 2 CSS-Klassen "active" und "usual" angelegt werden, welche dann per

  
document.getElementById(ID).className = 'active'  

gewechselt werden können.