Luke: Problem mir einfachem Dropdown Menü

Beitrag lesen

OK hallo zusammen erstmal.

Ich hab ein kleines Problem und verstehe es einfach nicht..
Bei MouseOver über einen Link soll darunter ein Liste sichtbar werden, bei MouseOut der Liste soll diese dann wieder verschwinden.

HTML:
<div>
  <a href="" onmouseover="ShowBox()>öffnen</a>
  <ul id="popuplist" onmousout="HideBox()">
    <li>..
  </ul>
</div>

JavaScript:
function ShowBox() {
document.getElementById('popuplist').style.visibility = 'visible';
}
function HideBox() {
document.getElementById('popuplist').style.visibility = 'hidden';
}

CSS:
#popuplist {
border:solid 1px #818183;
position:absolute; left:15px;
width:284px;
visibility:hidden;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0; padding:0;
margin-top:29px;
}
#popuplist li {
background:#E7E7E8;
margin:0; padding:10px;
padding-top:3px; padding-bottom:3px;
}

So sehen die wesentlichen Sachen aus. Der MouseOver funktioniert tadellos. Das Problem ist jetzt aber, dass sobald ich mit der Maus über die Liste fahre, diese ausgeblendet wird (so als stände da onmouseover anstatt onmouseout).

Hat jemand ein Idee woran da liegen könnte?