Mouseleave div，将背景颜色更改为灰色，将mouseleave更改为div内的触发Qtip，将背景颜色更改为粉色

Question

标题不言自明，这里是我目前为止的内容，但背景颜色始终在mouseout上保持灰色，而不是粉红色在qtip悬停：

$().ready(function() { 
$("#openDiv").mouseleave(function (e) { 
var used_classes = ['qtip']; 
var $c = $(e.relatedTarget).attr('class'); 

if ($c=='qtip') 
    { 
    $("#openDiv").css('background-color', 'pink'); 
    } else{ 
    $("#openDiv").css('background-color', 'grey'); 
    } 
}); 
}); 

http://jsfiddle.net/bUzPG/21/与完整的设置。这真让我抓狂！
任何解决此问题的答案都将被标记为答案。

Answer 1

我看到的是事件在鼠标离开'#openDiv'时触发，然后当你离开时e.relatedTarget就是你输入的任何内容，这是无关紧要的。 如果你想要的是主DIV悬停在qtip什么时候去的粉红色，你应该使用.hover（或.mouseenter设置它粉红色）的qtip一样简单......

$(".qtip").hover(
    function() { 
    $("#openDiv").css('background-color', 'pink') 
    }, 
    function() { 
    $("#openDiv").css('background-color', 'white') 
    } 
) 

我看到qtip的东西似乎是在DOM准备好后创建的，所以你可能想用.live来代替...

$(".qtip").live('mouseenter', function() { 
    $("#openDiv").css('background-color', 'pink') 
    }) 
    .live('mouseleave', function() { 
     $("#openDiv").css('background-color', 'white') 
    } 
)