jQuery - 例外のあるライブマウスとマウス例外

Question

こんにちは私のコードはうまくいきますが、#stemと#caseが上にぶら下がっているとアニメーションに含まれているのでdiv_mainGraphic上に絶対配置されます）。誰でもアイデアはありますか？ありがとう！

$('#div_mainGraphic').live("mouseenter mouseleave", function(event){ 
    if (event.type == 'mouseenter') { 
     $('#stem').animate({"top": "-=35px"}, 500); 
    } else { 
     $('#stem').animate({"top": "+=35px"}, 150); 
    } 
}); 

が働いていると私はこのような何かをやって考えていたコードです。ここ

$('#div_mainGraphic').live("mouseenter mouseleave", function(event){ 
    if (event.type == 'mouseenter') { 
     $('#stem').animate({"top": "-=35px"}, 500); 
    } 
    if (event.type == 'mouseleave') { 
     $('#stem').animate({"top": "+=35px"}, 150); 
    } 
    if (event.location == '???') { 
     ??? 
    } 
}); 

はHTMLです：

<div id="div_mainGraphic"> 
</div> 
<img src="/images/img_stem.png" id="stem" /> 
<img src="/images/img_case.png" id="case" /> 

Answer 1

は、あなたのコードと一緒に、これを、これを試してみてください基本的にホバー上のイベントの伝搬を停止します。

$("#stem, #case").hover(function(e){ 
    e.stopPropagation(); 
}); 

使用あなた

$('#div_mainGraphic').live("mouseenter mouseleave", function(event){ 
    if (event.type == 'mouseenter') { 
     $('#stem').animate({"top": "-=35px"}, 500); 
    } else { 
     $('#stem').animate({"top": "+=35px"}, 150); 
    } 
}); 

のこのコード代わりに、あなたはまた、彼らは絶対配置要素であるため、#div_mainGraphicに#stemとの#case要素を移動しようとすることができます。私のコードで

Answer 2

絶対にシンプルで読みやすいソリューション：

$('.free').live('mouseenter', function() { 
    $(this).find('.alert').fadeIn(200); 
}); 

$('.free').live('mouseleave', function() { 
    $(this).find('.alert').fadeOut(200); 
}); 

それをしなかった残念ながら