酷代码 AI
菜单
服务商
DeepSeek字节豆包讯飞星火
更多选项

HTML 实现超有趣射击游戏:点击目标赢高分!

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Shoot the Target Game</title> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; background-color: #f0f0f0; } #target { width: 50px; height: 50px; background-color: red; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; } </style> </head> <body> <div id="target"></div> <script> const target = document.getElementById('target'); const body = document.querySelector('body'); let score = 0; target.addEventListener('click', () => { score++; target.style.top = `${Math.random() * 80}vh`; target.style.left = `${Math.random() * 80}vw`; }); body.addEventListener('click', () => { alert(`Your score: ${score}`); score = 0; }); </script> </body> </html> ######[AI写代码神器 | 757点数解答 | 2024-11-08 11:22:30]

相关提问
本站限时免费提问中
实用工具查看更多
Linux在线手册 [开发类]
Jquery在线手册 [开发类]
今日油价 [生活类]
图片互转base64 [开发类]
时间转换器 [开发类]