title: Can't use cancelAnimationFrame. Nothing happens (chrome)
body: <p><strong>Problem:</strong> I can't cancel requestAnimationFrame using by chromes recognized cancelAnimationFrame.</p>
  
  <p><strong>What I tried:</strong> I used console.log but no errors displayed. I console.logged the cancelAnimationFrame and I get undefined, while the request counterpart logs fine. I also tried different version of cancelAnimationFrame, including the prefixed versions:</p>
  
  <pre><code>cancelAnimationFrame
  webkitCancelAnimationFrame
  window.cancelAnimationFrame etc..
  </code></pre>
  
  <p>I also tried putting the canceling code into the function but as expected that doesn't really matter. </p>
  
  <p><strong>Question:</strong> Why can't I stop my requestAnimationFrame? Is canceling it my way even recommended?</p>
  
  <hr>
  
  <p><a href="http://jsfiddle.net/p8hv15j4/2/" rel="nofollow">http://jsfiddle.net/p8hv15j4/2/</a></p>
  
  <hr>
  
  <pre><code>var elem = document.getElementById('test');
  var currentPos = 0;
  
  var requestAnimationFrame = window.requestAnimationFrame || 
                              window.mozRequestAnimationFrame || 
                              window.webkitRequestAnimationFrame || 
                              window.msRequestAnimationFrame;
  
  function fn() {
      currentPos += 5;
  
      elem.style.left = currentPos + "px";
  
      if (Math.abs(currentPos) &gt;= 900) {
          currentPos = -500;
      }
          requestAnimationFrame(fn);
  }
  fn();
  
  setTimeout(function() {
       cancelAnimationFrame(fn);
     }, 1000)
  </code></pre>