jQuery是一種廣泛使用的JavaScript庫,可以用于開發各種應用程序。其中包括各種與用戶交互的小游戲。下面是一個簡單的基于jQuery的小游戲示例:
$(document).ready(function() { // 初始化變量 var score = 0; var lives = 3; var level = 1; // 定義障礙物和目標的位置和速度 var obstacle = { x: 0, y: 200, speed: 10 }; var target = { x: 0, y: 0 }; // 隨機生成目標和障礙物的位置 function randomize() { target.x = Math.floor(Math.random() * 500); target.y = Math.floor(Math.random() * 400); obstacle.x = 500; obstacle.y = Math.floor(Math.random() * 400); obstacle.speed = Math.floor(Math.random() * 10 + 5); } // 定義游戲循環 function gameLoop() { // 移動障礙物 obstacle.x -= obstacle.speed; // 判斷是否撞到障礙物 if (Math.abs(target.x - obstacle.x)< 50 && Math.abs(target.y - obstacle.y)< 50) { lives--; if (lives< 0) { alert("游戲結束!"); reset(); } else { randomize(); } } // 判斷是否到達目標 if (Math.abs(target.x - $("#player").position().left)< 50 && Math.abs(target.y - $("#player").position().top)< 50) { score++; level = Math.floor(score / 10) + 1; randomize(); } // 更新得分和等級 $("#score").text("得分:" + score); $("#level").text("等級:" + level); // 移動目標和障礙物 $("#target").stop().animate({ left: target.x, top: target.y }, 0); $("#obstacle").stop().animate({ left: obstacle.x, top: obstacle.y }, 0); // 運行游戲循環 setTimeout(gameLoop, 50); } // 重置游戲 function reset() { score = 0; lives = 3; level = 1; randomize(); } // 啟動游戲 randomize(); gameLoop(); // 監聽玩家移動 $(document).mousemove(function(event) { $("#player").stop().animate({ left: event.pageX, top: event.pageY }, 20); }); });
以上代碼演示了一個簡單的障礙物避免和目標獲取的小游戲。它包括玩家的位置移動、目標和障礙物的位置隨機變換、得分和等級的更新等功能。