怎么去做一个好玩的弹弹球

首先我们需要在网页上绘制一块画布，并且做出画笔，给出画布的大小

<canvas width="600" height="500"></canvas>

  var canvas = document.getElementsByTagName('canvas')[0]

  var ctx = canvas.getContext('2d');

给我们的画布加上背景颜色

 canvas{

            background-color: #d55555;

        }

再画出我们的物体

 ctx.strokeRect(100,100,100,100);

在代码中找到物体宽高 

var y=100

var x=100

物体的移动我们需要一个值进行移动

var k=true;

var o=true;

然后给我们的物体加入移动的函数代码

 setInterval(function(){

            ctx.clearRect(0,0,600,500)

            // y += 5;

            ctx.strokeRect(x,y,100,100);

            if((y+5+100)>=500) {

              k=false  

            }else if(y-4<=0){

                k=true

            }

            if(k){

                y+=5

            }else{

                y-=4

            }

            // console.log(x,y)

            if((x+100+2)>=600){

                o=false

            }else if((x-1)<=0){

                o=true;

            }

            if(o){

                x+=2;

            }else{

                x-=1

            }

},10)