Meta Description" name="description" />
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Mobile Jumping Game</title>
<style>
body { margin: 0; padding: 0; overflow: hidden; background-color: #e0f7fa; font-family: sans-serif; touch-action: manipulation; }
canvas { display: block; background-color: #fff; margin: 20px auto; border-radius: 10px; box-shadow: 0 5px 15px rgba(0,0,0,0.2); }
.info { text-align: center; color: #333; }
</style>
</head>
<body>
<div class="info">
<h3>মোবাইল জাম্প গেম</h3>
<p>স্ক্রিনে **টাচ** করে লাফ দিন!</p>
</div>
<canvas id="gameCanvas"></canvas>
<script>
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
// মোবাইলের স্ক্রিন অনুযায়ী সাইজ ঠিক করা
canvas.width = window.innerWidth > 400 ? 400 : window.innerWidth - 40;
canvas.height = 250;
let score = 0;
let gameSpeed = 4;
let isGameOver = false;
const dino = { x: 30, y: 200, width: 40, height: 40, dy: 0, jumpForce: 10, gravity: 0.5, grounded: false };
let obstacles = [];
function spawnObstacle() {
let height = 30 + Math.random() * 30;
obstacles.push({ x: canvas.width, y: canvas.height - height, width: 25, height: height });
}
function update() {
if (isGameOver) return;
dino.dy += dino.gravity;
dino.y += dino.dy;
if (dino.y + dino.height > canvas.height) {
dino.y = canvas.height - dino.height;
dino.dy = 0;
dino.grounded = true;
}
if (Math.random() < 0.015) {
if (obstacles.length === 0 || obstacles[obstacles.length - 1].x < canvas.width - 150) {
spawnObstacle();
}
}
obstacles.forEach((obs, index) => {
obs.x -= gameSpeed;
if (dino.x < obs.x + obs.width && dino.x + dino.width > obs.x &&
dino.y < obs.y + obs.height && dino.y + dino.height > obs.y) {
isGameOver = true;
alert("গেম ওভার! আপনার স্কোর: " + score);
location.reload();
}
if (obs.x + obs.width < 0) {
obstacles.splice(index, 1);
score++;
gameSpeed += 0.1;
}
});
}
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
// প্লেয়ার (সবুজ বক্স)
ctx.fillStyle = "#4CAF50";
ctx.fillRect(dino.x, dino.y, dino.width, dino.height);
// বাধা (কালো বক্স)
ctx.fillStyle = "#333";
obstacles.forEach(obs => ctx.fillRect(obs.x, obs.y, obs.width, obs.height));
// স্কোর
ctx.fillStyle = "#000";
ctx.font = "20px Arial";
ctx.fillText("Score: " + score, 10, 30);
}
function loop() {
update();
draw();
requestAnimationFrame(loop);
}
// টাচ কন্ট্রোল
window.addEventListener('touchstart', (e) => {
if (dino.grounded) {
dino.dy = -dino.jumpForce;
dino.grounded = false;
}
});
loop();
</script>
</body>
</html>
1
1
4KB
4KB
117.0ms
188.0ms
117.0ms