Memory Game Project

Last Updated on
Matching Game

PROJECT: MEMORY GAME
DATE: 2016
DEMO: PLAY NOW
SKILLS: HTML/CSS/JAVASCRIPT/JQUERY/ANIMATE.CSS

Instructions

This is a simple memory game cerate with HTML, CSS, Javascript and jQuery library. The are 8 pair of card with total of 16 cards in each match. When clicking the card, it will be selected. The next move is to select the same pair of card which you just selected just now. Once both card is match, it will open and lock. Which means you have paired the card. To win this game, you need to pair all the card as lower move as possible to get higher ratings.

Code Dependencies

The app is built with the following code dependencies:

  • jquery.js – A javascript library is using in app.js to simplify the selector of HTML.
  • animate.css – An animation CSS library that helps to save the time on developing a animation from scratch. I use the bounce animation from here when open the card. Noted: The reason I’m using this library is because There are tons of very cool animation here. It would be great to add new feature for player choose their own animation when opening the card. Credit to https://daneden.github.io/animate.css/
  • app.js – This files contained all the game logics and implementation.
  • index.html – The HTML structure of the game.
  • app.css – The game style sheet use for designing the index.html.
BUY ME A COFFEE ☕
Write With ❤️ By Jorcus

Leave a Comment