如何用canvas制作动画

canvas制作动画方法如下:

工具/材料

dw等代码编辑工具

操作方法

  • 01

    先在HTML5页面主体里面添加一个<canvas>标签,定义一张画布(大小,背景颜色)代码
    在头部嵌入JS代码,并把画布加载到页当中去,代码如图

  • 02

    在(900,400)半径为30,起点为0的地方,逆时针画一个圆如图

  • 03

    运行程序,如图

  • 04

    创建一个定时函数,时数为50秒如图

  • 05

    创建两个变量(speed ,start)一个间歇函数,设置速度和开始时间如图

  • 06

    以球体运行的开始坐标(start)到终点坐标画一个圆如图

  • 07

    运行程序,结果你会发现如图

  • 08

    小球从右边移动到左边来了,结果如图

  • End
  • 发表于 2017-10-27 00:00
  • 阅读 ( 309 )
  • 分类:电脑网络

相关问题

0 条评论

请先 登录 后评论