| <html> |
| <body> |
| 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> |
| <canvas id="c" width="40" height="40"></canvas> |
| <script type="text/javascript"> |
| var angle = 0; |
| var canvas = document.getElementById('c'); |
| var ctx = canvas.getContext('2d'); |
| |
| function drawArrow() { |
| angle = angle + 0.1; |
| canvas.width = canvas.width; // reset canvas |
| |
| ctx.translate(ctx.canvas.width / 2, ctx.canvas.height / 2); |
| ctx.rotate(angle); |
| ctx.beginPath(); |
| ctx.rect(-10,-10, 20, 20); |
| ctx.fill(); |
| |
| document.body.style.cursor = 'url('+canvas.toDataURL()+'), pointer'; |
| requestAnimationFrame(drawArrow); |
| } |
| |
| requestAnimationFrame(drawArrow); |
| |
| </script> |
| </body> |
| </html> |