canvas动画实例1 | 甜心183

甜心183

关注(28)粉丝(399)

canvas动画实例1

让canvas画的正方形动起来

点击(此处)折叠或打开

<!DOCTYPE html >
<html>
<head>
<title>cars</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
</head>
<body>
<canvas id ="canvas" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var position = 0;
setInterval(function(){
ctx.clearRect(0,0,200,200);
ctx.fillRect(position,0,20,20);
position++;
if(position > 200){
position = 0;
}
},30)
</script>
</body>
</html>

11-10 20:14