solo tienes que poner en practica el ejemplo, creas 2 divs con id "uno" y otro con id "dos". el div uno contendra al div2 que simula ser una de tus opciones, observa el resultado.
si sales de tu div uno entrando a div dos (una opcion del menu) no se esconde, si sales fuera del div menu completamente te mostrara el alert, que es exactamente lo que quieres, detectar cuando se a salido y no cuando se
if (e.srcElement=="uno) // si el elemento es el div uno (el que contiene las opciones)
if (!e.toElement.id) //negacion, si no tiene id se a salido completamente.
otro ejemplo valido:
if(e.toElement.className!="className de las opciones)
en ese ultimo ejemplo hay que verificar tb que toElement no sea el propio menu, si no es el menu y tampoco las opciones por logica estas fuera.
te pongo un ejemplo entero para que veas que solo te da el alert al salir del div totalmente y no cuando te pones encima del otro.
Código HTML:
Ver original
function pp(e)
{
if (e.srcElement.className=="uno")
{
if(!e.toElement.className)
{
alert("sales del div completamente ");
}
}
}
window.addEventListener("mouseout",pp,false);
.uno
{
background-color: blue;
width: 300px;
height: 400px;
}
.dos
{
background-color: red;
width: 150px;
height: 200px;
}
No me he parado a mirar compatibilidad con navegadores etc, eso lo haces tu pero son 2 lineas mas como aquel que dice.