HTML and CSS Reference
In-Depth Information
To change the background color:
1. Return to the hanjie.js file in your text editor.
2. Directly below the setupPuzzle() function, insert the following code for the
changeBackground() function (see Figure 13-18):
function changeBackground() {
/* Determine the current background color of the data cell */
var bColor =;
/* If the color is gold, make it dark gray; if the color
is dark gray, change it to white; if the color is white,
change it back to gold */
if (bColor == “rgb(233, 207, 29)”) bColor = “rgb(101, 101, 101)”
else if (bColor == “rgb(101, 101, 101)”) bColor = “white”
else bColor = “rgb(233, 207, 29)”;
/* Apply the new background color to the data cell */ = bColor;
Figure 13-18
the changebackground() function
changes the cell
color from gold t o
dark gray to white
and back to gold
3. Add the following statements to the for loop of the setupPuzzle() function,
as shown in Figure 13-19, to apply an onclick event handler to every cell in
the puzzle:
/* Change the color with each click */
puzzleCells[i].onclick = changeBackground;
Figure 13-19
calling the changebackground() function
changes the
background col o r
each time the user
clicks a puzzle cell
Search WWH ::

Custom Search