Conseguir evento jQuery mouseout al fuego de todos los elementos secundarios

Question

Tengo una mesa dentro de un div, que contiene 8 imágenes, quiero disparar un evento mouseout, ya sea para la mesa o el div, pero no se dispara. Supongo que esto se debe a que el ratón está realmente saliendo cada una de las imágenes, o el TD o el tr etc ... ¿hay una manera de conseguir el evento mouseout para toda la tabla se propague de manera que se dispara incluso a partir de los elementos secundarios? El marcado es recta hacia adelante:

<div id=container>
  <table id="tbl">
    <tr>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
    </tr>
    <tr>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
    </tr>
  </table>
</div>

y mi código de jQuery es:

$("#tbl").mouseout(function(){
  alert("out home");
});

No puedo disparar los eventos mouseout individuales para las imágenes, porque a veces hay absolutamente elementos colocados sobre ellos, que hace que el evento mouseout a ser despedido antes de tiempo.

Answer 1

En caso de ser:

$("#tbl").mouseout(function(){
  alert("out home");
});

No ha contestado a la "#". Si desea que sólo las imágenes, trata de:

$("#tbl >img").mouseout(function(){
  alert("out home");
});

PS. ¿Ha considerado utilizar $ ( "..."). Libración (), en su lugar?

Answer 2

En caso de no utilizar #tbl para seleccionar la tabla?

$("#tbl").mouseout(function(){
  alert("out home");
});

Answer 3

Uso caso mouseleave, que tiene exactamente la misma funcionalidad pero no se dispara con elementos secundarios.

$("#tbl").bind("mouseleave",function(){
  alert("out home");
});