Question

我有jQuery跳出效果的问题。当没有反弹时，每一件事情都很好 - 弹跳，当你在按钮上快速移动很多次 - 在某些时候，盒子就是不隐藏。这个jsfiddle出了什么问题？

我的jsfiddle：

我的JS：

$('.flex_section').delegate('a','mouseenter mouseleave',function(e){
var a = $(this).attr('id');

if (e.type == 'mouseenter'){

    clearTimeout(t_on)

    if (a == 'abc'){
    clearTimeout(t_off)     
    t_on = setTimeout(function() { popup_show(a,t_on); }, 10);
    }
} else {

    t_off = setTimeout(function() { popup_remove(a,t_off); }, 1000);
}
)}

function popup_show(type,string){
if (type == 'abc'){

    $('#pc_' + type).css('display','block');
    $('#pc_' + type).effect( "bounce",{times:3,distance:20},1000);
}
clearTimeout(string);
}
function popup_remove(type,string){
    $('#pc_' + type).css('display','none');
    clearTimeout(string)
}

Answer 1

尝试使用stop

$('#pc_' + type).stop().effect( "bounce",{times:3,distance:20},1000);

Answer 2

保持简单：

function popup(){
    $('.flex_top a').hover(function(){
        var type = $(this).attr('id');
        var offset = $('#' + type).offset();
        $('#id_' + type).css('display','block')
        .offset({left:offset.left + 100, top:offset.top + 380})
        .effect( "bounce",{times:3,distance:20},1000);
    },function(){
       var type = $(this).attr('id');
       $('#id_' + type).fadeOut();
    }
  );
}

并且不要多次调用相同的对象搜索$('#id_' + type)

使用弹跳效果时的jQuery错误

2 个答案: