S2JS - Control: functions, loops, if-then-else : While experiments

Try making some changes to the while loop.

What if the counter variable increases by 10 instead of 5 ?

What if it increases by 1 ?

But make sure the corner variable keeps increasing each time through the loop.

If it stayed the same or got smaller, then the condition "(counter < 100)" would always remain true, and you'd have an infinite loop and your browser would "hang" or lock-up.

If that happens, you'll need to reload the page - not the end of the world, but a little untidy.

<HTML> <head> <title> My new Web Page </title> </head> <body> <canvas id=myCanvas width=300 height=300 style="background-color: pink;"> </canvas> <script> var ctx = myCanvas.getContext("2d"); var corner= 0; while (corner < 100) { ctx.strokeRect(corner, corner, 50, 50); corner= corner + 5; } </script> </body> </html>