/celebrityMemory

Fame Memory Game (Gaga inspired) in JavaScript

Primary LanguageCSS

===========================

There is no backend included in the build thus far. It is simply a fully-responsive "mobile first" front-end website using some of the lastest web-based technologies.

===========================

This website includes the following software dependencies

  • HTML5, CSS3, JavaScript, jQuery
  • _LoDash v2.4.1
  • Normalize.css and Responsive.css
  • backstretch and anystretch jQuery plugins
  • Google API's for font style

======= Information

An example of a simple Memory Game (match pairs) developed in CSS3, HTML5, normalize.js, jQuery (javascript) and _LoDash v2.4.1(javascript)

The game is not 100% finished. It's a first version and there's room for a ton of improvements, optimizations, etc. The most complete version is the one developed with lodashJS, because is using the amazing JS libraries to make the game behavior possible (shuffle, etc.)

Testing

For testing the game, the best way is to do it on a localhost on your computer. Otherwise, the game won't properly work (cross domain permissions, etc).

Purpose

The main purpose of this experiment is to try to make a simple, yet sexy game as fast as I can with some different technologies out there.

My background has always been HTML5 & CSS3 so I wanted to make a quick working version to showcase that knowledge.

Technologies

lodash (http://www.lodash.com/) → Lo-Dash is an exciting cross-platform utility library that targets Windows, Mac, Linux, iOS, Android, BlackBerry, Flash and HTML5. Its genius as a library is in delivering consistency, customization, performance, & extras.

jQuery (http://www.jquery.com/) → A widely adopted Javascript library for building rich, interactive experiences with HTML5. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

BACKSTRETCH.js (http://srobbin.com/jquery-plugins/backstretch/) -> a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element. Images are fetched after your page is loaded, so your users won't have to wait for the (often large) image to download before using your site.

ANYSTRETCH.js (https://github.com/danmillar/jquery-anystretch) ->Anystretch is a jQuery plugin that allows you to add a dynamically-resized background image to any page or block level element. The image will stretch to fit the page/element, and will automatically resize as the window size changes.

Images used in the game

The used icon set and background image are most likely copyright, but all were found using Google Images. You can freely redistribute it and use it for your personal purpose. If you want to use these icons for a commercial purpose, you will need the permission of the photography author(s). Please contact him or her before you upset someone.