使用Javascript動畫製作圖案

Question

這是我在這裏的第一個問題，因爲我傾向於搜索更多的問題，但目前我還沒有在任何地方找到答案。

我正在爲uniwersity做一個簡單的尋鴨遊戲，但是我找不到任何讓我的鴨子從底部飛到屏幕頂部的方法。我設法讓一隻鴨子飛一次，但只有當我按下按鈕時。嘗試了很多不同的東西，我得到了我的頭，但沒有奏效。

她是我的代碼：http://pastebin.com/gMd8M7bZ

我知道，我應該有我的陣列只鴨子，但ATM我只是想另一種解決方案和它沒有努力。希望你能幫助我們（我是JS中的newb：/）

Answer 1

您可以使用libgif庫。

它允許您啓動/停止gif並控制gif所在的幀。

<script type="text/javascript" src="./libgif.js"></script> 
<img src="./example1_preview.gif" rel:animated_src="./example1.gif" 
width="360" height="360" rel:auto_play="1" rel:rubbable="1" /> 

<script type="text/javascript"> 
    $$('img').each(function (img_tag) { 
     if (/.*\.gif/.test(img_tag.src)) { 
      var rub = new SuperGif({ gif: img_tag }); 
      rub.load(function(){ 
       console.log('oh hey, now the gif is loaded'); 
      }); 
     } 
    }); 
</script>