Internetexplorer und Navigation im CSS

[PetraB]

hallo zusammen,

es gibt im Archiv 2006 einen Beitrag über CSS Navigation in modernen Browsern und dem Problem, das der IE mehrere (hier waren es zwei) Navigationen in einer Seite nicht anzeigt.

Bei mir sollen vier unabhängige Navigationen rund um den mittleren Bereich  gruppiert werden. Das habe ich mit CSS (ul, li) realisiert und im Opera, Firefox etc. funktioniert das auch.

Für den IE habe ich das im SELFHTML zu findenden Coding auf der Seite eingefügt und entsprechend dem o.a. Hinweis angepasst.

Siehe hier:

<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
  function hoverIE4() {
    var LI = document.getElementById("Navigation4").firstChild;
    do {
      if (sucheUL4(LI.firstChild)) {
        LI.onmouseover=einblenden4; LI.onmouseout=ausblenden4;
      }
      LI = LI.nextSibling;
    }
    while(LI);
  }

function sucheUL4(UL) {
    do {
      if(UL) UL = UL.nextSibling;
      if(UL && UL.nodeName == "UL") return UL;
    }
    while(UL);
    return false;
  }

function einblenden4() {
    var UL = sucheUL4(this.firstChild);
    UL.style.display = "block"; UL.style.backgroundColor = "ffffcc";
  }
  function ausblenden4() {
    sucheUL4(this.firstChild).style.display = "none";
  };

if(window.navigator.systemLanguage && !window.navigator.language) {
  function hoverIE3() {
    var LI = document.getElementById("Navigation3").firstChild;
    do {
      if (sucheUL3(LI.firstChild)) {
        LI.onmouseover=einblenden3; LI.onmouseout=ausblenden3;
      }
      LI = LI.nextSibling;
    }
    while(LI);
  }

function sucheUL3(UL) {
    do {
      if(UL) UL = UL.nextSibling;
      if(UL && UL.nodeName == "UL") return UL;
    }
    while(UL);
    return false;
  }

function einblenden3() {
    var UL = sucheUL3(this.firstChild);
    UL.style.display = "block"; UL.style.backgroundColor = "ffffcc";
  }
  function ausblenden3() {
    sucheUL3(this.firstChild).style.display = "none";
  };

if(window.navigator.systemLanguage && !window.navigator.language) {
  function hoverIE2() {
    var LI = document.getElementById("Navigation2").firstChild;
    do {
      if (sucheUL2(LI.firstChild)) {
        LI.onmouseover=einblenden2; LI.onmouseout=ausblenden2;
      }
      LI = LI.nextSibling;
    }
    while(LI);
  }

function sucheUL2(UL) {
    do {
      if(UL) UL = UL.nextSibling;
      if(UL && UL.nodeName == "UL") return UL;
    }
    while(UL);
    return false;
  }

function einblenden2() {
    var UL = sucheUL2(this.firstChild);
    UL.style.display = "block"; UL.style.backgroundColor = "ffffcc";
  }
  function ausblenden2() {
    sucheUL2(this.firstChild).style.display = "none";
  };

if(window.navigator.systemLanguage && !window.navigator.language) {
  function hoverIE() {
    var LI = document.getElementById("Navigation").firstChild;
    do {
      if (sucheUL(LI.firstChild)) {
        LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
      }
      LI = LI.nextSibling;
    }
    while(LI);
  }

function sucheUL(UL) {
    do {
      if(UL) UL = UL.nextSibling;
      if(UL && UL.nodeName == "UL") return UL;
    }
    while(UL);
    return false;
  }

function einblenden() {
    var UL = sucheUL(this.firstChild);
    UL.style.display = "block"; UL.style.backgroundColor = "ffffcc";
  }
  function ausblenden() {
    sucheUL(this.firstChild).style.display = "none";
  }

window.onload = function()
 {hoverIE4();
  hoverIE3();
  hoverIE2();
  hoverIE();
 };

</script>

Leider funktioniert das gar nicht. Die beiden Navigationen rechts reagieren noch nicht einmal auf Mouse-over.

Sieht jemand auf Anhieb, was ich da falsch gemacht habe?

Danke und Gruß,
Petra