Canvas event handling: Difference between revisions

! Type !! Description !! DOM equivalent event !! Bubbles <ref>Bubbling phase. DOM Level 3 event flow. http://www.w3.org/TR/DOM-Level-3-Events/#event-flow</ref>

| ''mousedown'' || Mouse button pressed || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mousedown mousedown] || {{tick}}

| ''mouseup'' || Mouse button released || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseup mouseup] || {{tick}}

| ''click'' || ''mousedown'' + ''mouseup'' have been triggered for this element without moving more than a certain maximum distance || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-click click] || {{tick}}

| ''dblclick'' || Two ''click'' events have been triggered for this element without moving more than a certain maximum distance and time limit || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-dblclick dblclick] || {{tick}}

| ''drag'' || The mouse has been moved with a button down. After dragging has started above an element, all consecutive ''drag'' events are sent to this element even if the mouse leaves its area || || {{tick}}

| ''wheel'' || Mouse wheel rotated (see deltaY for direction) || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-wheel wheel] || {{tick}}

| ''mousemove'' || Mouse has moved while beeing inside the area of the target element. || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mousemove mousemove] || {{tick}}

| ''mouseover'' || Mouse has entered a child or the element itself. ''mouseover'' is also triggered if the mouse moves from one child element to another.  || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseover mouseover] || {{tick}}

| ''mouseleave'' || Mouse has left the element and all of its children. In contrary to ''mouseout'', ''mouseleave'' is not triggered if the mouse moves from one child element to another, but only if the mouse moves outside the element and all its children. || [http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseleave mouseleave] || {{cross}}