javascript - 使用 jQuery 在用户悬停时动画工具提示

Question

我试图让我的工具提示在鼠标悬停时反弹，

我有以下适用于零星结果的内容，如工具提示快速反弹 3 秒 ro 所以，然后慢 3 秒等...我还需要在鼠标悬停时停止此功能，有人可以看到我哪里出错得到弹跳速度的变化？

// Tooltip title
$('.male').mouseover(function(e) { 

    var tiptitle = $(this).find('.highlight');

    setInterval(function(){
              tiptitle.animate({top:'-85px'}, 100, function() {
              tiptitle.animate({top:'-75px'}, 100);
        });
    },200);
}).mouseout(function() {



});

Answer 1

如果您选择使用效果插件反弹效果的路线，请使用此代码，然后在 mouseout 上使用 stop()

$('.male').mouseover(function(e) {     
    var tiptitle = $(this).find('.highlight');    
    tiptitle.effect("bounce", { times:3 }, 300);
}).mouseout(function() {
    $(this).find('.highlight').stop();
 });

否则，我相信你会得到零星的反弹速度，因为 -85px 和 -75px 都在 100