Javascript 使用requestFrameAnimation收缩视频

Javascript 使用requestFrameAnimation收缩视频,javascript,animation,html5-canvas,Javascript,Animation,Html5 Canvas,我正在尝试使用requestFrameAnimation在按键时将视频缩小50%。这是我所拥有的,但一旦达到所需尺寸,收缩就不会停止 function shrink_video(){ if(v.width == WIDTH * 0.5){ shrink = false; } var shrink_value = WIDTH * 0.001; if(shrink){ v.width -= shrink_value; } requestAnimFrame(shrink_video); }

我正在尝试使用requestFrameAnimation在按键时将视频缩小50%。这是我所拥有的,但一旦达到所需尺寸,收缩就不会停止

function shrink_video(){

if(v.width == WIDTH * 0.5){
shrink = false;
}

var shrink_value = WIDTH * 0.001;

if(shrink){ 
v.width -= shrink_value;
}

requestAnimFrame(shrink_video);
}

我猜我需要调用cancelAnimationFrame,但我不知道如何根据视频大小来执行该操作。我考虑过使用setTimeout来触发取消操作,但这会导致视频大小不一致,无法正常工作;末端尺寸至关重要。有什么想法吗

javascript中的所有数字都是浮点数

这意味着像
v.width==width*0.50
这样的精确测试将失败,因为javascript数字的精度过高

相反,如果v.width超过一半宽度,则测试:

function shrink_video(){

    if(v.width>WIDTH*0.50){
        requestAnimationFrame(shrink_video);
    }

    v.width -= WIDTH*0.001;

}

对!非常感谢你。我没有意识到精度会是个问题,所以知道这一点很好!