javascript 动画

清除动画请求 cancelAnimationFrame(ids)

var div2=document.querySelector(".div2");
var x=div2.offsetLeft;
var y=div2.offsetTop;
var speedX=10
var speedY=10
var ids;
animation();

function animation(){
    // 在下一个请求的执行帧上执行这个回调函数
    ids=requestAnimationFrame(animation);
    // cancelAnimationFrame(ids)//清除动画请求
    x+=speedX;
    y+=speedY;
    if(y>=500-50){
        y=500-50;
        speedY=-speedY;
    }else if(y<=0){
        y=0;
        speedY=-speedY;
    }
    if(x>=1000-50){
        x=1000-50;
        speedX=-speedX;
    }else if(x<=0){
        x=0;
        speedX=-speedX;
    }
    div2.style.left=x+"px";
    div2.style.top=y+"px";
}