JavaScript
语言:
JaveScriptBabelCoffeeScript
确定
var radius = 100; //大球半径
var x = 200; //大球球的圆心坐标
var y = 200;
var bol = true;
var canvas = document.getElementById('chidoudou');
canvas.height = 800;
canvas.width = 1024;
var cxt = canvas.getContext('2d');
function ballOpen(x) { //张嘴
cxt.fillStyle = '#fff';
cxt.beginPath();
cxt.arc(x, y, radius, 1 / 4 * Math.PI, 3 / 2 * Math.PI + 1 / 4 * Math.PI, false);
cxt.lineTo(x, y);
cxt.closePath();
cxt.fill();
cxt.stroke();
}
function ballClose(x) { //闭嘴
cxt.fillStyle = '#fff';
cxt.beginPath();
cxt.arc(x, y, radius, 0, Math.PI * 2);
cxt.closePath();
cxt.fill();
cxt.stroke();
cxt.beginPath();
cxt.moveTo(x, y);
cxt.lineTo(x + radius, y);
cxt.closePath();
cxt.stroke();
}
var speed = 0;
var startPoint = x;
function run() {
speed = 2;
cxt.clearRect(0, 0, 1024, 800);
ballOpen(x);
var timer = setInterval(function() {
cxt.clearRect(0, 0, 1024, 800);
if (bol) {
ballClose(startPoint);
startPoint += 3;
bol = false;
} else {
ballOpen(startPoint);
startPoint += 3;
bol = true;
}
}, 1000);
}
run();