third_party/WebKit/ManualTests/canvas-cursor.html

   1 <html>
   2 <body>
   3 This is a test of our ability to convert a canvas to a data url and use it as a cursor. We pass if the cursor animates smoothly and without flickering.<br>
   4 <canvas id="c" width="40" height="40"></canvas>
   5 <script type="text/javascript">
   6 var angle = 0;
   7 var canvas = document.getElementById('c');
   8 var ctx = canvas.getContext('2d');
   9
  10 function drawArrow() {
  11     angle = angle + 0.1;
  12     canvas.width = canvas.width; // reset canvas
  13
  14     ctx.translate(ctx.canvas.width / 2, ctx.canvas.height / 2);
  15     ctx.rotate(angle);
  16     ctx.beginPath();
  17     ctx.rect(-10,-10, 20, 20);
  18     ctx.fill();
  19
  20     document.body.style.cursor = 'url('+canvas.toDataURL()+'), pointer';
  21     requestAnimationFrame(drawArrow);
  22 }
  23
  24 requestAnimationFrame(drawArrow);
  25
  26 </script>
  27 </body>
  28 </html>