Problema con mouseover y mouseout y jquery

[nicolasroma]

Hola, tengo el siguiente codigo

Código HTML:

<div onmouseover="imgOut(this)" onmouseout="imgIn(this)">
    <img src="img/quienescolor.jpg" alt="jpg"/>
    <img src="img/quienesbyn.jpg" alt="jpg"/>
</div>
 
function imgIn(o)
{
console.log(o.children[1]);
$(o.children[1]).fadeIn();
}
function imgOut(o)
{
console.log(o.children[1]);
$(o.children[1]).fadeOut();
}
 

La idea es que cuando se hace mouseover la foto que esta arriba haga fadeout y se vea la de abajo y cuando se hace mouseout que vuelve a aparecer la foto de arriba.

Lo que me sucedes que hago mouseover y funciona bien, pero cuando hago mouseout la imagen aparece y desaparece varias veces como si ejecutase las funciones varias veces y no entiendo porque, si alguien me ayuda se lo agradezco

Un Saludo

[YYs86]

Si pones problemas con jquery... xq no usas jquery de verdad:

Código Javascript:

$('#tuiddiv').hover(function() {
  $(this).find('img:first').stop(true, true).fadeOut();
}, function() {
  $(this).find('img:first').stop(true, true).fadeIn();
});