當動畫完成時球停止

Question

我有一個基本的想法，一個球彈跳，畢竟反彈它應該停止在舞臺動畫完成。

Problem-

球反彈都是好的，動畫是什麼，我希望它是。但是當動畫完成時它仍然沒有停止，它會變得不合框架。

一個解決方案，我是不兼容與 -

if(y>=300) 
{ 
x=110; 
y=300; 
} 

但球振動。

我want-

球應該平穩停車。

小提琴鏈接 - http://jsfiddle.net/stackmanoz/xWvEU/

Answer 1

你需要clear the interval您畫動畫。

在你的代碼，我沒有這個變化：

function init() 
{ 
    var ctx=document.getElementById("canvas").getContext("2d"); 

    return interval = setInterval(draw,10); 
} 

再上，如果：

if(y>=300) 
{ 
    clearInterval(interval); 
} 

檢查它在這個fiddle