Jquery mouseenter animation - mouseleave太快了

时间:2014-02-12 14:28:55

标签: jquery mouseenter mouseleave

请看一下这个小提琴:

http://jsfiddle.net/CQG4L/1/embedded/result/

我已经在mouseenter和mouseleave事件上创建了动画队列。

你会注意到如果你鼠标悬停/鼠标移动太快就会发生奇怪的事情。 实际上,这部分是mouseleave代码

$(this).find(".back_content img").fadeOut("fast");
$(this).find(".back_content .text_content").fadeOut("fast");

未执行。

我搜索过这个问题,发现stop()是一个可能的解决方案。我试图申请停止,但根本没有区别

$(document).ready(function () {
    $(".slide")
        .on("mouseenter",

    function () {
        $(this).find(".front_content").stop(true,true).animate({
            top: "-=88px",
        }, 300, function () {
            $(this).fadeOut("fast");
            $(this).parent().find(".back_content img").fadeIn("fast");
            $(this).parent().find(".back_content .text_content").fadeIn("fast");
        });
    })
        .on("mouseleave", function () {
        $(this).find(".back_content img").fadeOut("fast");
        $(this).find(".back_content .text_content").fadeOut("fast");
        $(this).find(".front_content").fadeIn("fast");
        $(this).find(".front_content").animate({
            top: "+=88px",
        }, 300);

    });
});

我通过对所有转换或其中一些转换应用stop()来测试它。仍然无法正常工作。

0 个答案:

没有答案