Question

我试图让两个动画同时淡入到屏幕上。目前这是不可能的，因为一个动画正在等待＆＃39; typed.js效果＆＃39;在计算动画延迟之前完成。

因此，为了同时拥有两个动画淡入淡出，我必须设置不同的动画延迟。

jsfiddle显示问题：

https://jsfiddle.net/harrydry/p4ev1nj2/13/

仅仅将动画延迟设置为两种不同的类型以使它们同步并不是一种解决方案。因为整个动画要复杂得多，而且不会起作用。我已经使用了css animations插件，如下所示：

<span class="line1 animated fadeIn">Jim Jarmusch</span>

Answer 1

如果jQuery fadeIn()是一个选项，您可以使用公共类作为选择器，动画将是同步的：

<强> HTML

<div style="display:none" class="test">
  Test 1
</div>
<div style="display:none" class="test">
  Test 2
</div>
<div style="display:none" class="test">
  Test 3
</div>
<div style="display:none" class="test">
  Test 4
</div>

<强> JS

$(document).ready(function() {
  $('.test').fadeIn('slow');
});

<强>小提琴

https://jsfiddle.net/ygzyoyxx/

两个动画同时淡出？

1 个答案: