Jquery鼠标管理鼠标

Question

<div id="div-1">I'm div-1</div>
<div id="div-2">I'm div-2</div>

JS

$("#div-1").bind('mouseover',function(event){
  $('#div-2').stop(true,true).fadeIn(100);
});
$('#div-2').bind('mouseleave', function(e) {
  $(this).stop(true,true).fadeOut(100);
});

我的问题是:如果我在#div-1中鼠标保存，我如何能够fadeOut #div-2？我目前使用的是jQuery1.2.6，无法更改版本。

编辑

小提琴手例子

Answer 1

$("#div-1").bind('mouseover',function(event){
  $(this).stop(true,true).fadeIn(100);
  $('#div-2').fadeOut(100);
});
$('#div-1').bind('mouseleave', function(e) {
  $(this).fadeOut(100);
  $('#div-2').fadeIn(100);
});

Answer 2

$("#div-1").bind('mouseover',function(event){
  $('#div-2').stop(true,true).fadeIn(100);
}).bind('mouseleave', function(event){
  $('#div-2').stop(true,true).fadeOut(100);
});
$('#div-2').bind('mouseleave', function(e) {
  $(this).stop(true,true).fadeOut(100);
});