Question

我有一个网页，我想要依次显示五个GIF动画;我的意思是 gif2 必须出现并且仅在 gif1 结束动画时才开始动画。我尝试了以下代码，但它有一个奇怪的行为，因为在FF和Chrome大多数时候它按我的意愿运行，但有时GIF会按顺序出现，但它们的动画已经结束。然而，在IE中，它从未按我的意愿运行，似乎有一个图像“预加载”功能。动画花了大约1秒钟。你能帮助我吗？谢谢

<script>
$(document).ready(function() {
$('#gif1').css('visibility','visible').hide().delay(100).fadeIn(400);
$('#gif2').css('visibility','visible').hide().delay(500).fadeIn(400);
$('#gif3').css('visibility','visible').hide().delay(1000).fadeIn(400);
$('#gif4').css('visibility','visible').hide().delay(1500).fadeIn(400);
$('#gif5').css('visibility','visible').hide().delay(2000).fadeIn(400);
});
</script>

Answer 1

也许这会有所帮助：

$(document).ready(function() {
   $('#gif1').css('visibility','visible').hide().delay(1000).fadeIn(400, function() {
      $('#gif2').css('visibility','visible').hide().delay(5000).fadeIn(400);
   });
});

Fiddle

javascript：如何按顺序显示gif，避免预加载

1 个答案: