//补充代码

        var posx=30,

            posy=0,

            dir=1,

            isMouseInRect=false;

        canvas.onmousemove=function(e){

            var mouseX=e.offsetX;

            var mouseY=e.offsetY;

            if( mouseX > posx && mouseX < posx+30 && 

                mouseY > posy && mouseY < posy+30){

                isMouseInRect=true;

            }else{

                isMouseInRect=false;

            }

        }

        setInterval(function(){

            if(!isMouseInRect){

                posy+=10*dir;

            }

            context.clearRect(30,0,canvas.width,canvas.height);

            context.fillStyle='red';

            context.fillRect(posx,posy,30,30);

            posy+=10*dir;

            if(posy+30>=canvas.height){

                dir=-1;

            }else if(posy<=0){

                dir=1;

            }

        },1000);