This project was completed as part of the Udacity Google Scholarship (Phase 2, Project 3) and tested Javascript skills. Although I have completed one project before using jQuery, the coding is all Vanilla JS in order to learn more skills in this language. The Javscript is used to manipulate the DOM to provide the functionality.
Loading the game: Download the folder with all files. Got to your preferred browser and open the index.html file. This game app is optimised for Google Chrome.
Playing the game: Once the game is open, click on a pair of cards. There are 16 cards and 8 pairs. Try to match the pairs. Once you have revealed a matching pair of cards they stay facing upwards. If the cards do not match they flip back down. Can you remember where the cards are and match them up? See how fast you can find the 8 pairs and beat your time.
The game uses Font Awesome for some of the icons, the font is downloaded via an online library (via a link in the head of the HTML file so you will need to be online to see these properly. The app also uses an online Google font in the same way.
Code was pulled from a Udacity repository and amended in line with the project rubric. The starter project had some HTML and CSS styling to display a static version of the Memory Game project. Some modifications were made to the HTML and CSS files but the predominant assessment was of Javascript skills.
HTML changes included changing ID and classes of elements in order to manipulate the DOM better and provide CSS styling. Most CSS changes related to animation and the addition of media queries to provide a more responsive design for smaller viewports on a variety of devices. Other CSS changes were to ensure there were no bugs in the playing of the game.