Los eventos de JavaScript onmouseover y onmouseout son muy caprichosos y dependiendo del explorador que utilicemos para ver la página, se comportarán de una forma o de otra.
Para comprender mejor como se comportan estos eventos he realizado un sencillo ejemplo de menú despleglable típico de JavaScript. Podéis ver el ejemplo aquí.
Os aconsejo que dediquéis unos segundos en ver el código fuente del ejemplo. Como pedéis apreciar, la página esta dividida principalmente en 3 elementos <div> que resumo a continuación.
- id="interfaz", es el bloque principal que se muestra al usuario.
- id="MenuError", es el menú desplegable que no funciona correctamente (ahora veremos porqué).
- id="MenuOK", es el menú desplegable que funciona correctamente.
En la página del ejemplo hay dos iconos como este 
. El icono de la izquierda mostrará el menú que funciona y el icono de la derecha mostrará el que no funciona correctamente.
Antes de explicar porque no funciona el menú del icono de la derecha, vamos a ver que acciones hemos realizado para darle la funcionabilidad esperada.
1- Hemos marcado con position:absolute tanto el objeto interfaz como el objeto MenuError.
2- También hemos marcado al objeto MenuError con display:none. Para que de forma predeterminada no se muestre el menú desplegable.
3- En el evento onmouseover de la imagen del icono de la derecha hemos llamado a la función MostrarMenu(id). Esta función lo único que hace es cambiar el atributo display para que se muestre el menú y darle una posición donde mostrarse.
4- En el evento onmouseout del objeto MenuError hemos llamado a la función OcultarMenu(). Con la intención de que si salimos con el ratón del area del menú, este debería ocultarse.
Bien, con esto todo debería funcionar correctamente. Si colocamos el ratón sobre el icono de la derecha estamos llamando a MostrarMenu(id) y el menú se muestra. Y cuando salimos del area del menú, estamos llamando a OculatarMenu() y el menú debería ocultarse.
Ahora dirijase a la página del ejemplo y coloque el ratón sobre el icono de la derecha he intente hacer click sobre una de las opciones del menú. ¿Que ocurre?. El menú se oculta cuando el ratón se coloca sobre el area del menú, o al menos, eso parece. ¿Porque?.
Lo que sucede es que cuando "paseamos" el ratón por el menú para llegar hacer click por ejemplo en la opción 1, estamos entrando y saliendo en varios objetos. Estos objetos son hijos del menú, o mejor dicho, del objeto padre <div> "MenuError".
Cuando salimos por ejemplo del primer <tr>, automaticamente se dispara al evento onmouseout del padre, y por lo tanto se llama a la función OcultarMenu(). Este es el comportamiento caprichoso al que me refería al principio y al parecer es el comportamiento predeterminado en el DOM.
¿Como solucionarlo?.
5- En el evento onmouseover del objeto MenuOK hemos llamado a la función MostarMenu(id).
Logicamente si cuando entro en un objeto hijo también se llama al evento onmouseover del padre, puedo aprovecharme de ello, llamando a MostrarMenu(id). De esta forma, después de todo el paseo de entrar y salir de los distintos objetos hijos (tr, td, img, etc), me aseguro que la última acción realizada será entrar en el elemento que contiene la opción 1 (o la opción 2) y por lo tanto estaremos disparando el evento onmouseover del padre que llama a MostrarMenu(id).
Comprobar que en el menú que se despliega con el icono de la izquierda podéis hacer click sobre las opciones del menú. Fijaros que la única diferencia en el código con este menú y el que no funciona es haber incluido onmouseover="MostarMenu('MenuOK');" en el objeto <div>.