Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

I'm trying to do a memory game board of images but when I put in the images, it doesn't work. Here's my HTML code: Game

I'm trying to do a memory game board of images but when I put in the images, it doesn't work.

Here's my HTML code:

Game

Matching Game!




Here is my javascript code (this is the part that isn't working):

var images = new Array(16); function initialize(){ images[0] = new Image(71, 71); images[0].src = "https://images.pexels.com/photos/356378/pexels-photo-356378.jpeg?auto=compress&cs=tinysrgb&h=350"; images[1] = new Image(71, 71); images[1].src = "https://images.pexels.com/photos/356378/pexels-photo-356378.jpeg?auto=compress&cs=tinysrgb&h=350"; images[2] = new Image(71, 71); images[2].src = "https://www.nationalgeographic.com/content/dam/animals/thumbs/rights-exempt/mammals/d/domestic-dog_thumb.jpg"; images[3] = new Image(71, 71); images[3].src = "https://www.nationalgeographic.com/content/dam/animals/thumbs/rights-exempt/mammals/d/domestic-dog_thumb.jpg"; images[4] = new Image(71, 71); images[4].src = "https://pbs.twimg.com/profile_images/846146544072101888/0sLpdiu1_400x400.jpg"; images[5] = new Image(71,71); images[5].src = "https://pbs.twimg.com/profile_images/846146544072101888/0sLpdiu1_400x400.jpg"; images[6] = new Image (71,71); images[6].src = "https://www.what-dog.net/Images/faces2/scroll0015.jpg"; images[7] = new Image (71,71); images[7].src = "https://www.what-dog.net/Images/faces2/scroll0015.jpg"; images[8] = new Image (71,71); images[8].src = "https://www.cesarsway.com/sites/newcesarsway/files/styles/large_article_preview/public/Common-dog-behaviors-explained.jpg?itok=FSzwbBoi"; images[9] = new Image (71,71); images[9].src = "https://www.cesarsway.com/sites/newcesarsway/files/styles/large_article_preview/public/Common-dog-behaviors-explained.jpg?itok=FSzwbBoi"; images[10] = new Image (71,71); images[10].src = "http://www.insidedogsworld.com/wp-content/uploads/2016/03/Dog-Pictures.jpg"; images[11] = new Image (71,71); images[11].src = "http://www.insidedogsworld.com/wp-content/uploads/2016/03/Dog-Pictures.jpg"; images[12] = new Image (71,71); images[12].src = "https://boygeniusreport.files.wordpress.com/2016/11/puppy-dog.jpg?quality=98&strip=all&w=782"; images[13] = new Image (71,71); images[13].src = "https://boygeniusreport.files.wordpress.com/2016/11/puppy-dog.jpg?quality=98&strip=all&w=782"; images[14] = new Image (71,71); images[14].src = "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQKrarG6z-Wx-Jzy7QyDEf1ZVQCui6d8rFZdHkOD9utNJV8RmxE9g"; images[15] = new Image (71,71); images[15].src = "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQKrarG6z-Wx-Jzy7QyDEf1ZVQCui6d8rFZdHkOD9utNJV8RmxE9g"; }

var memory_values = []; var memory_tile_ids = []; var tiles_flipped = 0; Array.prototype.memory_tile_shuffle = function(){ var i = this.length, j, temp; while(--i > 0){ j = Math.floor(Math.random() * (i+1)); temp = this[j]; this[j] = this[i]; this[i] = temp; } } function newBoard(){ tiles_flipped = 0; var output = ''; memory_array.memory_tile_shuffle(); for(var i = 0; i < memory_array.length; i++){ output += '

'; } document.getElementById('memory_board').innerHTML = output; } function memoryFlipTile(tile,val){ if(tile.innerHTML == "" && memory_values.length < 2){ tile.style.background = '#FFF'; tile.innerHTML = val; if(memory_values.length == 0){ memory_values.push(val); memory_tile_ids.push(tile.id); } else if(memory_values.length == 1){ memory_values.push(val); memory_tile_ids.push(tile.id); if(memory_values[0] == memory_values[1]){ tiles_flipped += 2; memory_values = []; memory_tile_ids = []; if(tiles_flipped == memory_array.length){ alert("New board."); document.getElementById('memory_board').innerHTML = ""; newBoard(); } }else { function flip2Back(){ var tile_1 = document.getElementById(memory_tile_ids[0]); var tile_2 = document.getElementById(memory_tile_ids[1]); tile_1.style.background = 'url(https://thumb1.shutterstock.com/display_pic_with_logo/670804/103533200/stock-vector-playing-card-back-side-x-mm-103533200.jpg) center'; tile_1.innerHTML = ""; tile_2.style.background = 'url(https://thumb1.shutterstock.com/display_pic_with_logo/670804/103533200/stock-vector-playing-card-back-side-x-mm-103533200.jpg)center'; tile_2.innerHTML = ""; memory_values = []; memory_tile_ids = []; } setTimeout(flip2Back, 700); } } } }

Thanks!

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Deductive And Object Oriented Databases Second International Conference Dood 91 Munich Germany December 18 1991 Proceedings Lncs 566

Authors: Claude Delobel ,Michael Kifer ,Yoshifumi Masunaga

1st Edition

3540550151, 978-3540550150

More Books

Students also viewed these Databases questions

Question

what is a peer Group? Importance?

Answered: 1 week ago

Question

Is conflict always unhealthy? Why or why not? (Objective 4)

Answered: 1 week ago