前面的話

  在javascript運(yùn)動(dòng)系列中,詳細(xì)介紹了各種運(yùn)動(dòng),其中就包括碰壁運(yùn)動(dòng)。但是,如果用canvas去實(shí)現(xiàn),卻是另一種思路。本文將詳細(xì)介紹canvas動(dòng)態(tài)小球重疊效果

 

效果展示

靜態(tài)小球

  首先,生成隨機(jī)半徑、隨機(jī)位置的50個(gè)靜態(tài)小球

iOS培訓(xùn),Swift培訓(xùn),蘋果開發(fā)培訓(xùn),移動(dòng)開發(fā)培訓(xùn)

<button id="btn">按鈕</button><canvas id="canvas" width="500" height="300" style="border:1px solid black">當(dāng)前瀏覽器不支持canvas,請(qǐng)更換瀏覽器后再試</canvas><script>var canvas = document.getElementById('canvas');var H=300,W=500;
btn.onclick =