1. Computing

Concentration Memory Game With Images

1. Introduction and Sample

clr gif
More of this Feature

Head Script Body Script

My Original Concentration/Memory Game generates all of the "pictures" using nothing more than a few stylesheet commands. So of course I then received several requests for a version that uses images instead. So here is a version that allows your visitors to match the images instead of matching coloured letters (you will have to supply the images).

You can use whatever images you like with this script as long as you own the right to use them on the web and provided that you resize them all to 60 pixels by 60 pixels before you start. You will need one image for the back of the "cards" and fifteen for the "fronts". Make sure that the image files are as small as possible or the game may take too long to load.

With this version I have limited the script to 30 "cards" as all of the images will make the page a lot slower to load.

Here is the memory game (Concentration) for you to try for yourself.

If you haven't played this game before the rules are very simple. There are 30 squares that conceal 15 pairs. You just select two squares. If the two you select match then they will remain visible, if they don't then they will disappear again after a second or so. The counter button at the bottom tracks how long it takes you to match all of the pairs. If you want to start over just press the counter button and the whole thing will be randomized for you to start over.

The images used in this sample do not come with the script, you will have to provide your own. If you do not possess suitable images to use with this script and are unable to create your own then you will either need to obtain suitable clipart or use the no image version of the script.

To add this game to your page you first need to obtain the head script.

Sample Page | Head Script | Body Script

©2014 About.com. All rights reserved.