Screen Color Change Animation

This JavaScript program demonstrates how to animate a color changing screen in WebGL program.

AnimateScreenColor.html

<!DOCTYPE html>
<html>
  <head>
    <title>XoaX.net's WebGL</title>

    <script type="text/javascript">
      var qGL;

      function Initialization() {
        // Get the WebGL Context
        var qCanvas = document.querySelector("#idCanvasWebGL");
        qGL = qCanvas.getContext("webgl");

        // Begin the animation loop with half second intervals.
        const kiIntervalId = setInterval(SwapColor, 500);
      }

      function SwapColor() {
        qGL.clearColor(Math.random(), Math.random(), Math.random(), 1.0);
        qGL.clear(qGL.COLOR_BUFFER_BIT);
      }
    </script>
  </head>
  <body onload="Initialization()">
    <canvas id="idCanvasWebGL" width="400" height="400" style="border:1px solid red"></canvas>
  </body>
</html>

WebGL JavaScript

Screen Color Change Animation

AnimateScreenColor.html

Output