previous

page 32

next
displaying the total

I was going to suggest that you implement this all by yourself but, when I tried myself, I found it was trickier than I thought.

It's not enough to keep adding the row or column score after each click because that score can be different to last time so we need to subtract the old_score from the total before adding the new score!

my index.html
<body>
<script>var total=0;</script>
<script>var pick=Random(9);</script>
<div id='left_panel'>
<img src='counters/0.png' id='pick'>
<div id='total'>0</div>
</div>

We will need a new bit of CSS to make the total sit under the picked counter -
flex-direction:column; because flex flows across the page by default.

my styles.css

#left_panel {
display:flex;
flex-direction:column;
align-items:center;
}
previous
next