Skip to content

Latest commit

 

History

History

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 

README.md

🏇 Horse Racing Game

jQuery를 사용하여 만든 간단한 경마 게임입니다. 키보드 입력으로 내 말을 조작하여 다른 말들과 경주하는 게임입니다.

🎮 게임 방법

  1. 난이도를 선택합니다 (EASY, NORMAL, HARD)
  2. START 버튼을 클릭하여 게임을 시작합니다
  3. 키보드의 아무 키나 눌러서 4번 레인(내 말)을 움직입니다
  4. 먼저 결승선에 도달하는 말이 승리합니다
  5. 게임이 끝나면 순위가 표시됩니다

🎯 게임 특징

  • 4개의 레인: 1~3번 레인은 자동으로 움직이고, 4번 레인은 플레이어가 조작
  • 3가지 난이도:
    • EASY: 느린 속도 (1400ms 간격)
    • NORMAL: 보통 속도 (800ms 간격)
    • HARD: 빠른 속도 (500ms 간격)
  • 실시간 순위: 게임 종료 시 1위부터 4위까지 순위 표시
  • 리셋 기능: RESET 버튼으로 게임 초기화

🛠️ 기술 스택

  • HTML5: 게임 구조
  • CSS3: 스타일링 및 레이아웃
  • JavaScript (jQuery): 게임 로직 및 상호작용
  • jQuery 3.7.1: DOM 조작 및 이벤트 처리

📁 파일 구조

project_0605/
├── project_0605.html    # 메인 HTML 파일
├── project_0605.css     # 스타일시트
├── project_0605.js      # 게임 로직
├── assets/
│   ├── background.jpg   # 배경 이미지
│   └── hourse.gif       # 말 애니메이션 이미지
└── README.md

🚀 실행 방법

  1. 프로젝트를 다운로드하거나 클론합니다
git clone [repository-url]
  1. assets 폴더에 필요한 이미지 파일들을 추가합니다:

    • background.jpg: 배경 이미지
    • hourse.gif: 말 애니메이션 이미지
  2. project_0605.html 파일을 웹 브라우저에서 열어 게임을 실행합니다

🎨 게임 화면

  • 헤더: 게임 제목 (주황색 배경)
  • 트랙: 4개의 갈색 레인과 말들
  • 순위 표시: 게임 결과 및 안내 메시지
  • 컨트롤: 리셋 버튼, 난이도 선택, 시작 버튼

⚙️ 주요 기능

게임 제어

  • gameStart(level): 선택한 난이도로 게임 시작
  • stopGame(): 게임 종료 및 순위 계산
  • initFunc(): 게임 상태 초기화

말 움직임

  • myHorseMoveFunc(): 키 입력으로 플레이어 말 움직임
  • moveRaceFunc(level): 자동으로 1~3번 레인 말들 움직임

순위 시스템

  • 각 말의 위치를 실시간으로 추적
  • 게임 종료 시 위치 기반으로 순위 결정

🔧 개발 포인트

  • 중복 실행 방지: raceStart, isGameOver 변수로 게임 상태 관리
  • 랜덤 움직임: Math.random()을 사용한 AI 말들의 자연스러운 움직임
  • 이벤트 관리: 게임 종료 시 이벤트 리스너 정리로 메모리 누수 방지

🐛 알려진 이슈

  • 게임 중 새로고침 시 상태 초기화 필요
  • 빠른 키 입력 시 말이 과도하게 빨라질 수 있음

📝 라이선스

이 프로젝트는 개인 학습 목적으로 제작되었습니다.


즐거운 경마 게임을 즐겨보세요! 🏆