HTML5 Canvas Desktop and Mobile Events Support Tutorial

To add event handlers to shapes that work for both desktop and mobile applications with KineticJS, we can use the on() method and pass in paired events.  For example, in order for the mousedown event to be triggered on desktop and mobile applications, we can use the "mousedown touchstart" event pair to cover both mediums.  In order for the mouseup event to be triggered on both desktop and mobile applications, we can use the "mouseup touchend" event pair.  We can also use the "dblclick dbltap" event pair to bind a double click event that works for both desktop and mobile devices.

Instructions: Mousedown, mouseup, touchstart, or touchend the circle on either a desktop or mobile device to observe the same functionality.

new window

Code Editor

Modified on April 9th, 2013 by Eric Rowell
comments powered by Disqus