
previous

page 11
next
styles.css
making the letters look better:
.row {
display:flex;
}
.square {
width:5vmin;
height:5vmin;
font-size:4vmin;
text-align:center;
}
display:flex;
}
.square {
width:5vmin;
height:5vmin;
font-size:4vmin;
text-align:center;
}

When the player clicks on one of the squares, the square_clicked function should highlight that square and remember it.
So set up a globals.js file with:
var g_square_id=0;
and a functions.js file for :
function highlight(id) {
function highlight(id) {
var el=document.getElementById(g_square_id);
el.style.backgroundColor='white';
var el=document.getElementById(id);
el.style.backgroundColor='palegreen';
g_square_id=id;
}
var el=document.getElementById(g_square_id);
el.style.backgroundColor='white';
var el=document.getElementById(id);
el.style.backgroundColor='palegreen';
g_square_id=id;
}
index.html
<script>
load_squares(g_sets[0]);
highlight(0);
</script>
</body>
</html>
load_squares(g_sets[0]);
highlight(0);
</script>
</body>
</html>
previous
next