我有点jQuery:
$('#list_cont').on('mouseenter', '.show_map', function() {
$(this).next('.map_cont').stop().fadeIn(800);
}).on('mouseleave', '.show_map', function() {
if (!$(this).next('.map_cont').is(':hover')) {
$(this).next('.map_cont').delay(600).stop().fadeOut(800);
}
});
$('#list_cont').on('mouseenter', '.show_map', function() {
$(this).stop().show();
}).on('mouseleave', '.map_cont', function() {
$(this).delay(600).stop().fadeOut(800);
});
它在.map_cont
mouseenter上显示.show_map
,然后如果悬停在.map_cont
上,则在光标离开.map_cont
之前不会淡出。
这适用于Chrome,但不适用于Firefox。我不知道如何跨浏览器测试这种类型的东西。
答案 0 :(得分:0)
由于.map_cont
位于#list_cont
内,所以它会这样做。因此,您需要以这种方式定义您的函数:
$('.map_cont').on('mouseleave', '.show_map', function() {
if (!$(this).next('.map_cont').is(':hover')) {
$(this).next('.map_cont').delay(600).stop().fadeOut(800);
}
});