How to set up a custom cursor for an object?

This is not a drawing mode. I want, in accordance with some condition, the cursor changes when I'm on some element. Sort of

$('#canvasID').css('cursor','pointer'); 

but it does not work for me. Do you know any property from your library? Thanks.

+5
source share
2 answers

After some tests, this works for me:

  canvas.observe('mouse:over', function (e) { if (e.target.get('type') == 'line') { e.target.hoverCursor = 'crosshair'; } }); 
+4
source

FabricJS has a built-in mechanism for setting a custom cursor (unfortunately, only for hover and move events):

 var canvas = new fabric.Canvas('myCanvas'); var circle = new fabric.Circle({ radius: 20, fill: 'red', left: 10, top: 10 }); circle.hoverCursor = 'no-drop'; canvas.add(circle); 

Other types of cursors can be found here .

+1
source

All Articles