使用canvas实现简单动画

chjunjun

于 2018-04-16 23:27:41 发布

阅读量9.6k

点赞数 4

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/chjunjun/article/details/79968261

这篇博客介绍了如何使用HTML5的Canvas API来创建一个简单的星星运动动画。通过调用getContext()获取绘图环境，利用Canvas绘图功能让星星在画布上移动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

大多数 Canvas 绘图 API 都没有定义在 <canvas> 元素本身上，而是定义在通过画布的 getContext()获得的一个“绘图环境”对象上。

实现如下星星的运动

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
	<canvas id='canvas' width="800px" height="500px"></canvas>
	<script type="text/javascript">
		var canvas = document.getElementById('canvas');
		var c = canvas.getConte