rt
<!DOCTYPE html>
<html>
<head>
<title> </title>
<style>
#player {
position: absolute;
bottom: 0;
left: 0;
width: 50px;
height: 50px;
background-color: red;
}
.obstacle {
position: absolute;
bottom: 0;
right: -50px;
width: 50px;
height: 50px;
background-color: green;
}
#jumpButton {
position: absolute;
top: 10px;
right: 10px;
}
#returnButton {
position: absolute;
top: 10px;
left: 10px;
}
</style>
</head>
<body>
<div id="player"></div>
<button id="jumpButton">跳跃</button>
<button id="returnButton">返回博客</button>
<script>
var player = document.getElementById("player");
var obstacles = [];
var jumpButton = document.getElementById("jumpButton");
var returnButton = document.getElementById("returnButton");
// 监听空格键按下事件
document.addEventListener("keydown", function(event) {
if (event.keyCode === 32) { // 空格键的键码是32
jump();
}
});
// 监听按钮点击事件
jumpButton.addEventListener("click", function() {
jump();
});
returnButton.addEventListener("click", function() {
window.location.href = "https://huchangzhi.github.io";
});
// 跳跃函数
function jump() {
if (!player.classList.contains("animate")) { // 修改条件,只有当玩家没有在跳跃时才能执行跳跃
player.classList.add("animate");
setTimeout(function() {
player.classList.remove("animate");
}, 500);
}
}
// 创建障碍物
function createObstacle() {
var obstacle = document.createElement("div");
obstacle.classList.add("obstacle");
document.body.appendChild(obstacle);
obstacles.push(obstacle);
moveObstacle(obstacle);
}
// 移动障碍物
function moveObstacle(obstacle) {
var obstacleInterval = setInterval(function() {
var playerLeft = parseInt(window.getComputedStyle(player).getPropertyValue("left"));
var obstacleRight = parseInt(window.getComputedStyle(obstacle).getPropertyValue("right"));
var playerBottom = parseInt(window.getComputedStyle(player).getPropertyValue("bottom"));
var obstacleTop = parseInt(window.getComputedStyle(obstacle).getPropertyValue("bottom"));
var obstacleBottom = obstacleTop + 50;
// 检测碰撞
if (playerLeft + 50 > obstacleRight && playerLeft < obstacleRight + 50 && playerBottom <= obstacleBottom && playerBottom >= obstacleTop) {
clearInterval(obstacleInterval);
alert("游戏结束!");
location.reload(); // 刷新页面
}
obstacle.style.right = (obstacleRight + 10) + "px";
// 移除超出屏幕的障碍物
if (obstacleRight > window.innerWidth) {
obstacle.remove();
obstacles.shift();
}
}, 50);
}
// 输入密码
var password = prompt("请输入密码:");
if (password === "050303") {
startGame();
} else {
window.location.href = "https://huchangzhi.github.io";
}
// 开始游戏
function startGame() {
setInterval(function() {
createObstacle();
}, 2000);
}
</script>
</body>
</html>
刚开始就结束,访问密码050303