Memory Game Programming JavaScript Tutorial

Lesson Code:
In this programming exercise you can learn to create a JavaScript powered memory game that you can easily enhance and extend as your skills improve as a JavaScript programmer. We will use HTML and CSS for the looks and user interface.


luffy Monkey says:

hi.. can u plz tell me how can i insert a timer into the above that when the game starts the timer starts..and when the user finishes the game it should display how much time the user took to finish the game..thanks

Geeman Rocks says:

How can I add images to the back side of the cards when it first put it down. I did to the css DIV , the radical gradient works , the image does not.  /* works          background: radial-gradient(circle, black, white);*/
 /* no worky    background: url(images/imagebg.jpg);*/
  border:#000 1px solid;

Sri harsha Ande says:

Hi Adam, How to add images to cards instead of alphabets

ScribblingOri says:

Hi 🙂 Nice Tutorial, thank you a lot!
After reading a few comments, I still don’t get how to use colors instead of letters for the memory cards! Actually I don’t want to use images/jpg’s, just chance the array, but when I do, the cards dissapear.. can anybody help me :/? It’s quite important! Thanks in anticipation (>.<)/

Mhaengel Actub says:

im gay

Ethan Camingao says:

How do I change the letters into images?

Jaguar Paw says:

who the fuck dislike this tutorial? 

Mahdi Lalani says:

can we set limitation of click after the user has clicked 10 cards the alert vil show u can’t play any more …pzl help

ガブリエラジョセフ says:

Where do we get the tile URLs? They never show up in my page. Do I have to save a file or something?


Bravo Man.. m/.. thanx a tonn..!

System Reality says:

Which Editor or IDE are you using?

sujith john says:


Roger Nkosi says:

so loving this

sujith john says:

I can’t get the tile.jpg to display . I have an image , renamed it, but nothing comes on the board.

Fiza Faiyaz surhio says:

Adam can you please tell me how to add a score counter for this game?

TDLRest says:

To be honest this tutorial is really bad, copy/paste and little explanation…

Antimatter youtube says:

This is great. I enjoy the teaching method.


This was a super good guide…but I hate niggas who do inline

skyy says:

Anyone know a way to match like 3+1 and 4 in this? Like match something that isnt identical but has the same value?

ishtineh joy says:

why does the background image for my memory game does not show up?plss help meeee…

adel says:

Great job Adam, keep up the good work 🙂

Nele Vm says:

hi, i’d like to implement your game but i have a problem. all my tiles form one big image so i can’t use div#memory-board >div background… (i’m using different images as tiles). is it also possible to make a memory card game on this way?

Sarah Griffiths says:

i’m not quite sure why, but i’ve written the code into my html document pretty much exactly as is and it’s not working :/ any suggestions?

John Cena says:

Suppose i want to give pictures instead of the alphabets then what changes should i do??

Banjerd Millionrich says:

I use & modify Adam’s code then make an android memory game as this

StickMan1316 says:

I’m getting an error where you put memory_array.memory_tile_shuffle(); on line 43 it says its not a function. by the way I’m making the JavaScript format external

parul kashyap says:

can someone please give me a link of this code? I wrote the exact code but it doesnt work 🙁 I am able to see the design part accurately but the tiles dont flip. I dont understand what i am doing wrong. I am very disheartened by this and if I could look at the running code at once and compare it will really help me.

John Cena says:

can anyone please edit the program and put score in this game!! I need it asap! And also if a match is made then can anyone make the cards disappear!! Your help is highly appreciated.

 Write a comment


Do you like our videos?
Do you want to see more like that?

Please click below to support us on Facebook!