S2JS - Control: functions, loops, if-then-else : If-else inside a for loop

Here we're combining what we learned previously about for loops with what we now know about if else.

We're doing a loop very similar to before, but adding something to say when 'corner is less than 50, the strokes will be green, otherwise they'll be red'.

if (corner < 50) { ctx.strokeStyle= "green"; } else { ctx.strokeStyle= "red"; }

<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"); for (var corner= 0; corner < 100; corner= corner+5) { if (corner < 50) { ctx.strokeStyle= "green"; } else { ctx.strokeStyle= "red"; } ctx.strokeRect(corner, corner, 50, 50); } </script> </body> </html>