美文网首页
canvas运动

canvas运动

作者: 星空有月 | 来源:发表于2016-12-24 22:27 被阅读16次

    canvas的运动,是一个不断清除画布内容,不断重绘,因为canvas类似一张图片,所以它的重绘一部分和重绘整个画布的效率是一样的。
    如下,简单的运动

    var oC = document.getElementById('c1');
    var gd = oC.getContext('2d');
    var x = 100;
    setInterval(function(){
        gd.clearRect(0,0,oC.width,oC.height);//清除画布,从0,0开始,清除到oC.width,oC.height
        gd.strokeRect(x+=5,100,100,100);//不断重绘整个矩形
    },16);
    

    这样一个div就运动起来了。

    相关文章

      网友评论

          本文标题:canvas运动

          本文链接:https://www.haomeiwen.com/subject/ljdrvttx.html