title: Why is cancelAnimationFrame not working?
body: <p>Refer to this fiddle - <a href="http://jsfiddle.net/rnqLfz14/28/" rel="nofollow">http://jsfiddle.net/rnqLfz14/28/</a></p>
  
  <p>[ This code is not mine - <a href="http://www.isaacsukin.com/news/2015/01/detailed-explanation-javascript-game-loops-and-timing" rel="nofollow">http://www.isaacsukin.com/news/2015/01/detailed-explanation-javascript-game-loops-and-timing</a> ]</p>
  
  <pre><code>//....
  
  function stop() {
      running = false;
      started = false;
      cancelAnimationFrame(frameID);
  }
  
  //...
  
  function mainLoop(timestamp) {
      // Throttle the frame rate.
      if (timestamp &lt; lastFrameTimeMs + (1000 / maxFPS)) {
          frameID = requestAnimationFrame(mainLoop);
          return;
      }
      delta += timestamp - lastFrameTimeMs;
      lastFrameTimeMs = timestamp;
  
      begin(timestamp, delta);
  
      if (timestamp &gt; lastFpsUpdate + 1000) {
          fps = 0.25 * framesThisSecond + 0.75 * fps;
  
          lastFpsUpdate = timestamp;
          framesThisSecond = 0;
      }
      framesThisSecond++;
  
      var numUpdateSteps = 0;
      while (delta &gt;= timestep) {
          update(timestep);
          delta -= timestep;
          if (++numUpdateSteps &gt;= 240) {
              panic();
              break;
          }
      }
  
      draw(delta / timestep);
  
      T.textContent = timestamp;
  
      if (timestamp &gt;= 6000.0) {
          T.textContent = "Stopped!";
          stop();
      }
  
      end(fps);
  
      frameID = requestAnimationFrame(mainLoop);
  }
  //...
  </code></pre>
  
  <p>The cancelAnimationFrame function is not stopping the animating loop. Got any suggestions? I have scratched my head over it for a long time now please any suggestions would be appreciated. </p>