Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

html5 canvas hand cursor problems

I'm playing around with html5 and some javascript to make a minor sketchpad. Whenever I click down on the canvas in chrome, the cursor becomes a text cursor. I have tried putting cursor: hand in the css, but that doesn't seem to work. This has got to be an easy thing, but I look it up and can't find it anywhere

like image 237
pfunc Avatar asked Apr 17 '10 20:04

pfunc


People also ask

How do I get rid of my hand cursor?

Are you working on a Microsoft Word document and you're stuck because the cursor has become a hand? It's super-easy to fix. All you need to do is press the Esc key. That will switch the cursor back to the regular pointy selection cursor.

Is HTML5 canvas still used?

The HTML5 canvas has the potential to become a staple of the web, enjoying ubiquitous browser and platform support in addition to widespread webpage support, as nearly 90% of websites have ported to HTML5.

How do I change the cursor in canvas JS?

To change cursors when hovering over individual shapes you must do mouse hit-testing versus each shape (versus each path). You can hit-test a shape (a path) using the isPointInPath method. Save this answer.


1 Answers

Use the disable text selection on the canvas. This works like a charm.

var canvas = document.getElementById('canvas');
canvas.onselectstart = function () { return false; } // ie
canvas.onmousedown = function () { return false; } // mozilla

Cheers, Kris

like image 65
Kris Avatar answered Oct 08 '22 13:10

Kris