Question

我现在有一些问题了。我试图让这项工作，但我测试了其中一个没有工作或没有按预期工作的东西。在这种情况下，回调不起作用。我需要有三个动画，其中一个带有回调，在同一个元素上有不同的时间。

$('#hey').animate({
  'margin-left': '100px',
}, {queue: false, duration: 1000});

$('#hey').animate({
  'margin-top': '100px',
}, {queue: false, duration: 1500}, function() {
  alert('hey'); // <-- this doesn't work -->
});

$('#hey').animate({
  'height': '190px',
}, {queue: false, duration: 2000});

#hey {
  width: 50px;
  height: 50px;
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="hey"></div>

Answer 1

使用complete属性

$('#hey').animate({
    'margin-top': '100px',
}, {
    queue: false,
    duration: 1500,
    complete: function () {
        // Callback here
        alert('hey'); // In your case...
    }
});

请注意，SO不能自行阅读文档

使用回调在不同时间为相同元素设置动画

1 个答案: