Meta Description" name="description" />
<!DOCTYPE html><html>
<head>
<title>Advanced Car Game</title>
<style>
body { margin: 0; overflow: hidden; }
canvas { background: #222; display: block; margin: auto; }
</style>
</head>
<body>
<canvas id="gameCanvas" width="400" height="600"></canvas><script>
const canvas = document.getElementById("gameCanvas");
const ctx = canvas.getContext("2d");
let car = { x: 180, y: 500, width: 40, height: 80 };
let obstacles = [];
let score = 0;
let speed = 5;
let level = 1;
// Sound
const crashSound = new Audio("https://www.soundjay.com/button/beep-10.mp3");
function drawCar() {
ctx.fillStyle = "red";
ctx.fillRect(car.x, car.y, car.width, car.height);
}
function drawObstacles() {
ctx.fillStyle = "yellow";
obstacles.forEach(obs => {
ctx.fillRect(obs.x, obs.y, 40, 80);
});
}
function updateObstacles() {
if (Math.random() < 0.04) {
obstacles.push({ x: Math.random() * 360, y: -80 });
}
obstacles.forEach(obs => {
obs.y += speed;
if (
obs.x < car.x + car.width &&
obs.x + 40 > car.x &&
obs.y < car.y + car.height &&
obs.y + 80 > car.y
) {
crashSound.play();
alert("Game Over! Score: " + score);
document.location.reload();
}
});
obstacles = obstacles.filter(obs => obs.y < canvas.height);
score++;
// Level up
if (score % 500 === 0) {
level++;
speed += 1;
}
}
function drawScore() {
ctx.fillStyle = "white";
ctx.font = "18px Arial";
ctx.fillText("Score: " + score, 10, 25);
ctx.fillText("Level: " + level, 10, 50);
}
function gameLoop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawCar();
drawObstacles();
updateObstacles();
drawScore();
requestAnimationFrame(gameLoop);
}
// Keyboard controls
window.addEventListener("keydown", e => {
if (e.key === "ArrowLeft" && car.x > 0) car.x -= 25;
if (e.key === "ArrowRight" && car.x < 360) car.x += 25;
});
// Touch controls (mobile)
canvas.addEventListener("touchstart", e => {
let touchX = e.touches[0].clientX;
if (touchX < window.innerWidth / 2 && car.x > 0) {
car.x -= 30;
} else if (car.x < 360) {
car.x += 30;
}
});
// Start game
gameLoop();
</script></body>
</html>2
2
2KB
2KB
128.0ms
116.0ms
318.0ms