<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/balls.js" ></script>
</head>
<body>
<canvas id="canvas" style="border: 1px solid #aaa; display: block;margin: 50px auto;"></canvas>
</body>
</html>
var ball = {x:612,y:100,r:20,g:2,vx:-4,vy:0,color:"#005588"}
window.onload = function(){
var canvas = document.getElementById("canvas");
canvas.width = 1024;
canvas.height = 768;
var context = canvas.getContext("2d");
setInterval(
function(){
loading(context);
move()
},
30
)
}
function move(){
ball.x += ball.vx;
ball.y += ball.vy;
ball.vy += ball.g;
if(ball.y > 768 - ball.r){
ball.y = 768- ball.r;
ball.vy = -ball.vy*0.66;
}
}
function loading(cxt){
cxt.clearRect(0,0,cxt.canvas.width,cxt.canvas.height)
cxt.fillStyle = ball.color;
cxt.beginPath();
cxt.arc(ball.x,ball.y,ball.r,0,2*Math.PI);
cxt.closePath();
cxt.fill();
}
478
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
