/*

Das Script muss je nachdem in welchem Layoutbereich man die Navigation abgelegt hat noch angepasst werden.
Im meinem Fall habe ich zum Testen die Navigation im Layoutbereich main abgelegt. Daher im Script die Zeile:

1 var sfEls = document.getElementById("*main*").getElementsByTagName("li");

Wenn Sie die Navigation im Layoutbereich header abgelegt haben, muss die Zeile entsprechend angepasst werden.

1 var sfEls = document.getElementById("*header*").getElementsByTagName("li");

Grundsätzlich muss der Identifier (ID) angegeben werden, mit dem die Navigation umschlossen ist. Das Script läuft durch alle Listenelemente, die unterhalb der Identifiers main liegen, und ändert die Klassennamen im DOM um, indem es den zusätzliche Klassennamen sfhover anhängt.

*/

sfHover = function() {
   var sfEls = document.getElementById("nav-suckerfish-horiz").getElementsByTagName("li");
   for (var i=0; i<sfEls.length; i++) {
         sfEls[i].onmouseover=function() {
             this.className+=" sfhover";
			 document.getElementById("suckerfish").style.height='500px';
         }
         sfEls[i].onmouseout=function() {
             this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
			 document.getElementById("suckerfish").style.height='100px';
         }
     }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);