├── README.md ├── audio ├── car.wav └── songs.mp3 ├── images ├── LOGO.png ├── car1.jpg ├── car2.jpg ├── car3.jpg ├── car4.jpg ├── car5.jpg ├── car6.jpg ├── car7.jpg ├── car8.jpg ├── car9.jpg ├── cross_the_road.png └── man.jpg ├── index.html ├── index.js └── styles.css /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 | ![GitHub repo size](https://img.shields.io/github/repo-size/codeaashu/Cross-Road-Game) 4 | ![GitHub stars](https://img.shields.io/github/stars/codeaashu/Cross-Road-Game?style=social) 5 | ![GitHub forks](https://img.shields.io/github/forks/codeaashu/Cross-Road-Game?style=social) 6 | [![Twitter Follow](https://img.shields.io/twitter/follow/warrior_aashuu?style=social)](https://twitter.com/intent/follow?screen_name=warrior_aashuu) 7 | 8 |
9 |

🎮 Cross Road Game 🎮

10 | 11 |
🏎️💨Play the Game ✦

12 | 13 | ` Welcome to the Cross Road Car Game! In this thrilling game, you'll guide a car across busy roads filled with obstacles, testing your reflexes and strategic thinking. Get ready to experience endless fun and challenges! `
14 | 15 |

Game Features 🌟

16 | 17 | - **Simple Controls:** Easy-to-use keyboard controls for intuitive gameplay. 18 | - **Dynamic Difficulty:** Roads with varying speeds and traffic, making each level increasingly challenging. 19 | - **Endless Fun:** The game continues until you crash, so challenge yourself to beat your high score! 20 | - **Responsive Design:** Enjoy a seamless experience on both desktop and mobile devices. 21 | - **Music and Sound:** Enjoy a musical and smooth sound that makes your game experience better. 22 | 23 |

Functionalities ⚙️

24 | 25 | - **Keyboard Controls:** Use arrow keys to move the car up, down, left, or right. 26 | - **Randomized Traffic:** Cars, trucks, and other obstacles appear at random intervals and speeds. 27 | - **Score Tracking:** Your score increases with every successful road crossed. 28 | - **Game Over Detection:** The game ends when your car collides with an obstacle. 29 | 30 |

🏎️💨 How to Play 🎮

31 | 32 | 1. **Start the Game:** Click on the play button or press `Enter` to begin. 33 | 2. **Move the Car:** Use the arrow keys on your keyboard to move the car in the desired direction. 34 | - **Up Arrow (↑):** Move forward 35 | - **Down Arrow (↓):** Move backward 36 | - **Left Arrow (←):** Move left 37 | - **Right Arrow (→):** Move right 38 | 3. **Cross the Roads:** Navigate through the traffic and try to cross as many roads as possible without crashing. 39 | 4. **Score Points:** Each successful crossing adds points to your score. 40 | 5. **Avoid Obstacles:** Dodge cars, trucks, and other road hazards that come your way. 41 | 42 |

Game Rules 🚨

43 | 44 | - **Stay on the Road:** Keep your car on the road to avoid penalties. 45 | - **Avoid Collisions:** If your car collides with another vehicle or obstacle, the game will end. 46 | - **Increase Your Score:** The more roads you cross, the higher your score. 47 | - **Speed Up:** As you progress, the speed and frequency of the obstacles will increase, adding to the challenge. 48 | 49 | 50 |
51 | 52 | ` Enjoy the Game! ` 53 | 54 | We hope you have fun playing the Classic Cross Road Game. If you have any feedback or suggestions, feel free to share them with us. Happy Gaming! 55 | 56 | `Don't forget to give A star to this repository ⭐` 57 | 58 | 59 | `👍🏻 All Set! 💌` 60 | 61 |
62 | -------------------------------------------------------------------------------- /audio/car.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/audio/car.wav -------------------------------------------------------------------------------- /audio/songs.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/audio/songs.mp3 -------------------------------------------------------------------------------- /images/LOGO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/LOGO.png -------------------------------------------------------------------------------- /images/car1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car1.jpg -------------------------------------------------------------------------------- /images/car2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car2.jpg -------------------------------------------------------------------------------- /images/car3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car3.jpg -------------------------------------------------------------------------------- /images/car4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car4.jpg -------------------------------------------------------------------------------- /images/car5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car5.jpg -------------------------------------------------------------------------------- /images/car6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car6.jpg -------------------------------------------------------------------------------- /images/car7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car7.jpg -------------------------------------------------------------------------------- /images/car8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car8.jpg -------------------------------------------------------------------------------- /images/car9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/car9.jpg -------------------------------------------------------------------------------- /images/cross_the_road.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/cross_the_road.png -------------------------------------------------------------------------------- /images/man.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeaashu/Cross-Road-Game/c31e75015caac93b88e6bfcd69bfd3ac876a3db0/images/man.jpg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 15 | 16 | 17 | 18 | 19 | Cross Road 20 | 21 | 22 |
24 | 25 |
26 |

Press "Space" To Start The Game

27 |
28 | 29 |
30 |
31 |
32 |
33 | 34 |
35 | 36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | var manStartLoc = 15; 2 | var level = 1; 3 | 4 | var cars = []; 5 | var carNo = 0; 6 | var carStartloc = 29; 7 | var carEndLoc = carStartloc + 2; 8 | var temp = 0; 9 | 10 | var song = new Audio("audio/songs.mp3"); 11 | var carCrah = new Audio("audio/car.wav"); 12 | 13 | var gameTime = 500; 14 | 15 | function manMove(){ 16 | if (manStartLoc === 1){ 17 | manStartLoc = 15; 18 | level += 1; 19 | 20 | if(gameTime < 100){ 21 | if(gameTime < 50){ 22 | gameTime = gameTime; 23 | } 24 | else{ 25 | gameTime -= 10; 26 | } 27 | } 28 | else{ 29 | gameTime -= 25; 30 | }; 31 | 32 | $(".levelH1").text("LEVEL: " + level); 33 | } 34 | else{ 35 | manStartLoc = manStartLoc - 1; 36 | }; 37 | $(".man_div").css("grid-row-start", manStartLoc); 38 | } 39 | 40 | var space = 32; 41 | var fd = 0; 42 | $(document).keydown(function(e){ 43 | if (e.which == fd) { 44 | manMove() 45 | return false; 46 | }; 47 | if (e.which == 13) { 48 | location.reload(); 49 | return false; 50 | }; 51 | if (e.which == space) { 52 | setTimeout(myFunction, gameTime); 53 | space = 0; 54 | fd = 38; 55 | $(".levelH1").text("LEVEL: 1"); 56 | return false; 57 | }; 58 | }); 59 | 60 | var myFunction = function() { 61 | song.play(); 62 | var n = Math.floor(Math.random()*13+2); 63 | var m = Math.floor(Math.random()*9+1); 64 | while(temp === n){ 65 | n = Math.floor(Math.random()*13+2); 66 | }; 67 | $(".game").append("
") 68 | cars.push("car"+carNo) 69 | carNo += 1; 70 | carStartloc -= 1; 71 | carEndLoc = carStartloc + 2; 72 | for (var i=0; i < cars.length; i++){ 73 | $("."+ cars[i]).css("grid-column-start", carStartloc + i); 74 | $("."+ cars[i]).css("grid-column-end", carEndLoc + i); 75 | if ( $("."+ cars[i]).css('grid-column-start') == "1"){ 76 | $("."+ cars[i]).remove(); 77 | }; 78 | }; 79 | temp = n; 80 | setTimeout(myFunction, gameTime); 81 | } 82 | 83 | var interval = setInterval(function(){ 84 | var babu = 0; 85 | for (var i=0; i < cars.length; i++){ 86 | if ( $("."+ cars[i]).css('grid-column-start') === $(".man_div").css('grid-column-start') && $("."+ cars[i]).css('grid-row-start') === $(".man_div").css('grid-row-start')){ 87 | clearInterval(interval); 88 | babu += 1; 89 | if (babu === 1){ 90 | $(".game").remove(); 91 | $(".body").append("

GAME OVER

"); 92 | $(".levelH1").text("Press Enter To Restart"); 93 | song.pause(); 94 | song = 0; 95 | carCrah.play(); 96 | }; 97 | }; 98 | }; 99 | },50); 100 | 101 | -------------------------------------------------------------------------------- /styles.css: -------------------------------------------------------------------------------- 1 | *{ 2 | border: 0; 3 | padding: 0; 4 | margin: 0; 5 | } 6 | 7 | body{ 8 | background-color: #ff0000; 9 | } 10 | 11 | .body{ 12 | background-color: #ff0000; 13 | display: flex; 14 | justify-content: center; 15 | align-items: center; 16 | width: 100vw; 17 | height: 92vh; 18 | } 19 | 20 | .game{ 21 | background-color: white; 22 | width: 120vmin; 23 | height: 92vmin; 24 | border: 3px solid #D09CFA; 25 | display: grid; 26 | grid-template-columns: repeat(30,1fr); 27 | grid-template-rows: repeat(15,1fr); 28 | } 29 | 30 | .gameOver{ 31 | background-color: black; 32 | width: 120vmin; 33 | height: 92vmin; 34 | border: 3px solid red; 35 | display: flex; 36 | justify-content: center; 37 | align-items: center; 38 | } 39 | 40 | p{ 41 | font-size: 6rem; 42 | border: 3px solid red; 43 | padding: 4%; 44 | font-weight: 500; 45 | color: white; 46 | justify-content: center; 47 | align-items: center; 48 | } 49 | 50 | .car{ 51 | height: 100%; 52 | width: 100%; 53 | 54 | } 55 | 56 | .level{ 57 | color: white; 58 | } 59 | 60 | .man{ 61 | height: 100%; 62 | width: 100%; 63 | 64 | } 65 | 66 | .car_div{ 67 | grid-row-start: 2; 68 | grid-column-start: 20; 69 | grid-column-end: 23; 70 | } 71 | 72 | .man_div{ 73 | grid-row-start: 15; 74 | grid-column-start: 15; 75 | } 76 | --------------------------------------------------------------------------------