Question

我试图在开始下一个动画之前等待这个动画完成。我搜索过但似乎没有答案符合我的具体需求。我需要这个第一个div向上滑动，然后在完成之后下一个div可以向下滑动。这是我的网站：http://www.francodavarre.com/

    $('.contact_block').click(function() {
         $('.hide_me').slideUp(400);
         $('.contact_me').slideDown(400);
    });

当你点击块时，我希望隐藏的div降下来，一旦你点击另一个块，div就出现了。停止。然后与您单击的另一个块对应的div将关闭。

Answer 1

有两种基本方法可以做你想做的事：

1：在“完整”回调中指定第二个动画：

$('.contact_block').click(function() {
    $('.hide_me').slideUp(400, function() {
        $('.contact_me').slideDown(400);
    });
});

<强> Demo

2：在“完成”处理程序中指定第二个动画，该处理程序链接到第一个动画生成的承诺：

$('.contact_block').click(function() {
    $('.hide_me').slideUp(400).promise().done(function() {
        $('.contact_me').slideDown(400);
    });
});

<强> Demo

在这两种情况下，你都会看到外部函数中有一个内部函数，如果你之前没有遇到过这样的函数，那将会很困惑。这是你必须在javascript中习惯的东西，其中函数是可以像其他变量一样定义和传递的第一类对象。

如何在继续动画之前停止动画？

1 个答案: