0

我不知道如何最好地解释这一点,而且我确信我的头衔不能胜任。这是问题所在。我需要在页面的一侧建立一个拉出。当您将鼠标悬停在选项卡上时,它会从左侧拉出。悬停时,它会移回原来的位置。除了一个烦恼之外,这一切都很好。如果您快速在 div 上上下滑动鼠标,它会将多个 .animate 函数排入队列,从而使选项卡多次弹出和弹出。以下是截至撰写本文时令人烦恼的网站:http: //mattandjentry.com/weddings/

这是我的jQuery:

$(document).ready(function() {
    $("#session_pullout").css("left", "-370px"); 

    $("#session_pullout").hover(function() {
        $("#session_pullout").animate(
                {"left": "-50"},
                "fast");
        }, function(){
            $("#session_pullout").animate(
                {"left": "-370px"},
                "fast");
        });
});
4

2 回答 2

3

还有一个.stop()问题。

用于.stop()停止当前运行的动画。或者,您也可以调用.stop(true)清除动画队列;或者,.stop(true, true)在清除动画队列的基础上跳转到动画的末尾。

$(document).ready(function () {
    $("#session_pullout").css("left", "-370px");

    $("#session_pullout").hover(function () {
        $("#session_pullout").stop().animate({
            "left": "-50"
        }, "fast");
    }, function () {
        $("#session_pullout").stop().animate({
            "left": "-370px"
        }, "fast");
    });
});

看看参数,.stop()看看哪个更适合您的需要。

于 2013-01-20T23:47:24.450 回答
0

使用.stop().

$("#session_pullout").hover(function() {
    $("#session_pullout").stop(true, true).animate({
        left: '-50px'
    }, 'fast');
}, function() {
    $("#session_pullout").stop(true, true).animate({
         left: '-370px'
    }, 'fast');
});

这将清除动画队列并强制运行下一个动画。您可以在此处找到文档。

于 2013-01-20T23:49:01.300 回答