JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

//吃豆豆动画//

var radius = 100; //大球半径

var x = 150; //大球球的圆心坐标

var y = 300;

var bol = true;

var canvas, cxt;

window.onload = function() {

canvas = document.getElementById('chidoudou');

canvas.height = 500;

canvas.width = 1024;

cxt = canvas.getContext('2d');

runRight();

}

function ballOpenRight(x) { //张嘴

cxt.fillStyle = '#ffff00';

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();

}

function ballOpenLeft(x) { //张嘴

cxt.fillStyle = '#ffff00';

cxt.beginPath();

cxt.arc(x, y, radius, 3 / 4 * Math.PI, 3 / 2 * Math.PI - 1 / 4 * Math.PI, true);

cxt.lineTo(x, y);

cxt.closePath();

cxt.fill();

}

function ballCloseRight(x) { //闭嘴

cxt.fillStyle = '#ffff00';

cxt.beginPath();

cxt.arc(x, y, radius, 0, Math.PI * 2);

cxt.closePath();

cxt.fill();

cxt.beginPath();

cxt.moveTo(x, y);

cxt.lineTo(x + radius, y);

cxt.closePath();

cxt.stroke();

}

function ballCloseLeft(x) { //闭嘴

cxt.fillStyle = '#ffff00';

cxt.beginPath();

cxt.arc(x, y, radius, Math.PI * 1, Math.PI * 3);

cxt.closePath();

cxt.fill();

cxt.beginPath();

cxt.moveTo(x, y);

cxt.lineTo(x - radius, y);

cxt.closePath();

cxt.stroke();

}

function runRight() { //球球动起来

var startPoint = x;

var time = 0;

cxt.clearRect(0, 0, 1024, 800);

ballOpenRight(x);

var timer = setInterval(function() {

time += 1;

if (time == 10) {

window.clearInterval(timer);

runLeft(startPoint);

} else {

cxt.clearRect(0, 0, 1024, 800);

if (bol) {

ballCloseRight(startPoint);

startPoint += 5;

bol = false;

} else {

ballOpenRight(startPoint);

startPoint += 5;

bol = true;

}

}

}, 1000);

}

function runLeft(startPoint) {

cxt.clearRect(0, 0, 1024, 800);

ballOpenLeft(startPoint);

var time = 0;

var timer = setInterval(function() {

time += 1;

if (time == 10) {

runRight();

window.clearInterval(timer);

} else {

cxt.clearRect(0, 0, 1024, 800);

if (bol) {

ballCloseLeft(startPoint);

startPoint -= 5;

bol = false;

} else {

ballOpenLeft(startPoint);

startPoint -= 5;

bol = true;

}

}

}, 1000);

}