### پروژه: بازی پلتفورمر کوچک در جاوا اسکریپت با کد منبع
**بازی پلتفورمر کوچک** یک بازی ساده و سرگرمکننده است که با استفاده از **جاوا اسکریپت**، **HTML** و **CSS** توسعه یافته است. در این بازی، شما باید شخصیت را کنترل کنید تا از موانع عبور کند و امتیاز جمعآوری کند.
### ویژگیهای پروژه:
1. **گرافیک ساده و جذاب**: طراحی کاربرپسند که بازیکنان را درگیر میکند.
2. **کنترل آسان**: استفاده از کلیدهای صفحهکلید برای حرکت و پرش.
3. **امتیازدهی**: جمعآوری امتیازها و نمایش آنها در صفحه.
### نحوه اجرای پروژه:
1. **فایلهای پروژه**: اطمینان حاصل کنید که فایلهای پروژه شامل `index.html`, `style.css`, و `script.js` را دارید.
2. **باز کردن پروژه**: فایل `index.html` را در مرورگر خود باز کنید.
### کد منبع:
#### HTML (index.html)
```html
بازی پلتفورمر کوچک
```
#### CSS (style.css)
```css
body {
margin: 0;
padding: 0;
background-color: #e0e0e0;
font-family: Arial, sans-serif;
}
#gameArea {
position: relative;
width: 600px;
height: 400px;
border: 2px solid #000;
overflow: hidden;
background-color: #fff;
}
#player {
position: absolute;
width: 40px;
height: 40px;
background-color: green;
bottom: 0;
left: 50px;
}
#scoreBoard {
position: absolute;
top: 10px;
left: 10px;
font-size: 20px;
}
```
#### JavaScript (script.js)
```javascript
const player = document.getElementById('player');
const scoreBoard = document.getElementById('score');
let score = 0;
let isJumping = false;
// حرکت شخصیت
document.addEventListener('keydown', (event) => {
if (event.key === 'ArrowUp') {
jump();
}
});
// پرش شخصیت
function jump() {
if (!isJumping) {
isJumping = true;
player.classList.add('jump');
setTimeout(() => {
player.classList.remove('jump');
isJumping = false;
score++;
scoreBoard.textContent = score;
}, 300);
}
}
// استایل پرش
const style = document.createElement('style');
style.innerHTML = `
.jump {
animation: jumpAnimation 0.3s forwards;
}
@keyframes jumpAnimation {
0% { bottom: 0; }
50% { bottom: 100px; }
100% { bottom: 0; }
}
`;
document.head.appendChild(style);
```
### توضیحات کد:
1. **HTML**: شامل ساختار پایه بازی با یک ناحیه بازی و نمایش امتیاز.
2. **CSS**: طراحی ناحیه بازی و شخصیت با رنگ و ابعاد مشخص.
3. **JavaScript**: شامل منطق بازی، حرکت شخصیت و افزایش امتیاز.
### جمعبندی
بازی پلتفورمر کوچک یک پروژه سرگرمکننده و آموزشی است که به شما کمک میکند با مفاهیم توسعه بازی در جاوا اسکریپت آشنا شوید. شما میتوانید با افزودن ویژگیهای جدید مانند موانع، انیمیشنهای بیشتر و سیستم امتیازدهی پیشرفته، بازی را گسترش دهید و تجربه بیشتری کسب کنید.
| صفحه قابل مشاهده:
دانلود پروژه بازی پلتفورمر کوچک در جاوا اسکریپت با کد منبع میباشد