Given the following code, what picture is displayed in the second image on the page when the first image is clicked on the first time? ___________________________ arr = new Array() arr[0] = ”dog.jpg” arr[1] = “cat.jpg” arr[2] = “bird.jpg” arr[3] = “bunny.jpg” arr[4] = “goat.jpg” arr2 = new Array() arr2[0] = ”wombat.jpg” arr2[1] = “echidna.jpg” arr2[2] = “platypus.jpg” arr2[3] = “bilby.jpg” arr2[4] = “muntjac.jpg” arr2[5] = “boobie.jgp” counter = 3 function ChangeIt() { counter = counter + 1 document.images[‘pic3’].src = arr[counter] counter2 = counter + 4 if counter2 == arr2.length { counter2 = 0 } else if counter2 == arr2.length + 1 { counter2 = 1 } else if counter2 == arr2.length + 2 { counter2 = 2 } else if counter2 == arr2.length + 3 { counter2 = 3 } document.images[‘pic4’].src = arr2[counter2] } My Page

Given the following code snippet, what picture is displayed when the second image is clicked on?____________________ arr = new Array() arr[0] = ”wombat.jpg” arr[1] = “echidna.jpg” arr[2] = “platypus.jpg” arr[3] = “bilby.jpg” arr[4] = “muntjac.jpg” arr[5] = “boobie.jgp” counter = 1 function ChangeIt(holder1, holder2) { document.images[‘pic4’].src = arr[holder2] counter = counter + 1 document.images[‘pic4’].src = arr[holder1] } <img src = "pic1.jpg" width = "500" height = "375" id = "pic1" onClick = "ChangeIt(5,2)"/> <img src = "pic2.jpg" width = "500" height = "375" id = "pic2" onClick = "ChangeAll(3,1)"/> <img src = "pic3.jpg" width = "500" height = "375" id = "pic3" onClick = "ChangeAll(0,4)"/>

Short Answer (20 pts) (5 pts) Write the code snippet such that when you click on an image, the text is changed. Include the appropriate html code as well (the images and paragraphs that call the function). When you call the function, you should pass in the name of the image you want to change. function ChangeText(holder) { document.getElementById(holder).innerHTML = “New Text” } <img src = "pic1.jpg" width = "500" height = "375" id = "pic1" onClick = "ChangeText(‘mytext’)"/> Text I’ll change

(5 pts) Write a function that changes any text element on the page so that it has a solid border and centered text. function ChangeStyle(holder) { document.getElementById(holder).style.borderStyle= “solid” document.getElementById(holder).style.textAlign = “centered” } <img src = "pic1.jpg" width = "500" height = "375" id = "pic1" onClick = "ChangeText(‘mytext’)"/> Text I’ll style

(10 pts) Given the following html code, write the function ChangeAll that generates a random number and uses that number to change both the text for a paragraph and the picture for an image on the page: txtArr = new Array() txtArr[0] = “New Text 1” txtArr[1] = “New Text 2” txtArr[2] = “New Text 3” txtArr[3] = “New Text 4” picArr = new Array() picArr[0] = “pic1.jpg” picArr[1] = “pic2.jpg” picArr[2] = “pic3.jpg” picArr[3] = “pic4.jpg” function ChangeAll(holder1,holder2) { rand = Math.floor(Math.random() * txtArr.length) document.images[holder1].src = picArr[rand] document.getElementById(holder2).innerHTML = txtArr[rand } <img src = "pic1.jpg" width = "500" height = "375" id = "pic1" onClick = "ChangeAll(‘para1’,’pic2’)"/> <img src = "pic2.jpg" width = "500" height = "375" id = "pic2" onClick = "ChangeAll(‘para2’,’pic3’)"/> <img src = "pic3.jpg" width = "500" height = "375" id = "pic3" onClick = "ChangeAll(‘para1’,’pic4’)"/> <img src = "pic4.jpg" width = "500" height = "375" id = "pic4" onClick = "ChangeAll(‘para2’,’pic1’)"/> First paragraph here Second paragraph here

Practice Problem 1: – Write an array of images. – Write a function that takes 2 input parameters: the id of an image on the web page and a number. In the function you should check to see if the number is greater than or equal to (>= ) the length of the array of images If it is >= to the length of the array, then display the image in the array at 0 Otherwise, display the array at the number passed in. Practice Problem 2: – Write a text array – Write html code with 4 different paragraphs. – Write a function that generates 4 different random numbers, each the length of the text array, and places different text in each of the 4 different paragraphs based on the random number generated. Practice Problem 3: – Write an array of images. – Write a function that takes as input the id of an image on the web page. – The function should display the first image in the array. – The function should then generate a prompt asking, “do you like that picture?” – If the answer is no, the next image in the array should be displayed. If the counter >= to the length of the array of image, you should show the first image again. Practice Problem 4: – Write 2 arrays of images: – Write 2 functions Each should have a separate counter (counter1 and counter 2) The first function should display the first image in the first array. It should increase its counter. If its counter >= the length of the first array, it should reset to 0 It should then use setTimeout to pause for 1500 msec, then call the second function The second function should display the first image in the second array It should increase its counter. If its counter >= the length of the second array, it should reset to 0 The second function should then use the setTimeout to pause for 1500 msec, then call the first function

arr1 = new Array() arr1[0] = “pic1.jpg” arr1[1] = “pic2.jpg” arr1[2] = “pic3.jpg” arr2= new Array() arr2[0] = “pic4.jpg” arr2[1] = “pic5.jpg” arr2[2] = “pic6.jpg” arr2[3] = “pic7.jpg” counter1 = 0 counter2 = 0 function func1() { document.images[“pic1id”].src = arr1[counter1] counter1 = counter1 + 1 if (counter1 >= arr1.length) { counter1 = 0 } setTimeout(“func2()”,1500) } function func2() { document.images[“pic2id”].src = arr2[counter2] counter2 = counter2 + 1 if (counter2>= arr2.length) { counter2 = 0 } setTimeout(“func1()”,1500) }

ls = new Array() ls[0] = "kittysleeping.jpg" ls[1] = "kittymetric.jpg" ls[2] = "kittyfur-back.jpg" ls[3] = "kittysit.jpg" ls[4] = "kittyalcohol.jpg" ls[5] = "kittybelly.jpg" count = -1 function loopforbackground(idholder, idholder2) { document.body.style.backgroundImage = “” document.getElementById(idholder2).innerHTML = " " continuevar = true while (continuevar == true) { count = count + 1 if (count == ls.length) { count = 0 } document.images[idholder].src = ls[count] continuevar = confirm("Do you want to see another picture?") } document.body.style.backgroundImage = “url(‘pic.jpg’)” document.body.style.backgroundImage = "url(\'" + ls[count] + "\')" document.getElementById(idholder2).innerHTML = "click here for other background options" } Click here to see potential pics...

BlackJack (sort of) Overall Game: You’re going to write a web page in which you get asked if you want another card continuously, and, if you say yes, a new card will be displayed in a different place on the web page. You’re trying to make the cards come as close to but not go over 21. Steps: 1.Create an array of images. The images (pictures) should be of the numbers 1 through 11 (Note: the image of number 1 will go in the array at 0 because we always start our arrays at 0) 2.Write an html page with space for 12 images (probably a table with images in it.) Each image should have a unique id. 3.Create a counter variable. 4.Write a function GetCards() 5.Inside GetCards, write a confirm asking, “do you want a card”. 6.Write a loop. Your loop will continue while the answer from confirm is true 7.Inside your loop, generate a random number between 0 and the length of your image array. 8.Slightly challenging part: 1.Now (still inside your loop), you will create an if statement, that goes something like this: 2.If the counter is equal to 0, use the random number generated to display the image from the array (like we’ve done before). You will display the image in the first id on the web page. 3.If the counter is equal to 1, you’ll display the image in the second id on the web page. 4.If the counter is equal to 2, you’ll display the image in the third id on the web page, 5.… 6.If the counter is equal to 11, you’ll display the image on the twelfth id on the web page. 9.Now you will use the confirm to ask, “do you want another card”. 10.End your loop 11.End your function Advanced Modifications: Keep track of the total number generated by adding each random number generated together. If the number goes over 21, modify text on the page to say, “You lose!” Modification #2: After the loop, but before the end of the function, generate a random number between 12 and 25 (The dealer’s hand). If the dealer’s random number is >21, modify text on the page to say, “You win!” Otherwise, check to see whose value is closer to 21 and modify text to report who won, accordingly