jQuery Animate：两次调用的回调

Question

当用户在网站上向下滚动时（使用 onepage-scroll 的 afterMove 回调），我触发了一组动画，并且在为某些元素设置动画时，意外地多次调用同一个函数。

使用这个，我没有问题：

base = $('section[data-index="' + index + '"]');
base.find('h1').animate({opacity: 0.1}, 3000);
console.log('Finished #' + index);

在转到第 3 节后，我在控制台上有正确的输出。

Finished #2
Finished #3

但是当我尝试使用表单时，例如，

base.find('#my-form-id').animate({opacity: 0.1}, 3000);

这是输出：

Finished #2
Finished #3
Finished #2
Finished #3

只有在动画结束时才注册最后两个日志。

导致这种行为的原因是什么？

Answer 1

其实我找错地方了。

真正的问题是我使用 CSS3 不透明度过渡设置元素的样式。当我尝试对使用相同属性的同一元素应用任何其他操作时，我遇到了这个问题。

看起来他们在一起玩得不太好。