jaminrai
Colour Guessing Game (JS Mini Project) By Sanjana Gautam
index.html <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <title>Color Guessing Game</title> <link rel=”stylesheet” href=”styles.css”> </head> <body> <h1>Color Guessing Game</h1> <div id=”colorDisplay”></div> <div id=”message”></div> <div id=”container”> <div class=”square”></div> <div class=”square”></div> <div class=”square”></div> <div class=”square”></div> <div class=”square”></div> <div class=”square”></div> </div> <script src=”script.js”></script> </body> </html> style.css body { text-align: center; font-family: Arial, sans-serif; } h1 { color: steelblue; … Read moreColour Guessing Game (JS Mini Project) By Sanjana Gautam
Image Slider (JS Mini Project) By Rupen Prasai
index.html <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <link rel=”stylesheet” href=”styles.css”> <title>Image slider</title> </head> <body> <h1>Image Slider</h1> <div class=”slider”> <div class=”slides”> <img src=”image1.JPG” alt=”Image 1″> <img src=”image2.jpg” alt=”Image 2″> <img src=”image3.JPG” alt=”Image 3″> </div> <button class=”prev” onclick=”changeSlide(-1)”>Previous</button> <button class=”next” onclick=”changeSlide(1)”>Next</button> </div> <script src=”script.js”></script> </body> </html> style.css .slider { position: relative; max-width: … Read moreImage Slider (JS Mini Project) By Rupen Prasai
Breakout- JavaScript Mini Project | 726. Prabal Basnet | Breakout
index.html <!DOCTYPE html> <html><head><title>BREAKOUT GAME</title> <style> canvas { border: 1px solid black; display: block; margin: auto; } </style> </head> <body> <canvas id=”mycanvas” width=”480″ height=”320″></canvas> <script> var canvas= document.getElementById(“mycanvas”); var ctx=canvas.getContext(“2d”); var ballRadius = 10; var x = canvas.width / 2; var y = canvas.height – 30; var dx = 2; var dy = -2; … Read moreBreakout- JavaScript Mini Project | 726. Prabal Basnet | Breakout
Memory Game, A JavaScript Mini Project : Bipin Khambu Shrestha
index.html <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <title>Memory Game</title> <link rel=”stylesheet” href=”styles.css”> </head> <body> <div class=”memory-game” id=”memory-game”></div> <script src=”script.js”></script> </body> </html> styles.css .memory-game { display: flex; flex-wrap: wrap; width: 400px; height: 400px; margin: 20px auto; perspective: 1000px; } .card { width: calc(25% – 10px); height: calc(25% – 10px); margin: 5px; position: relative; transform-style: preserve-3d; … Read moreMemory Game, A JavaScript Mini Project : Bipin Khambu Shrestha