Cascading Mouse Events Between a Div with Canvas On Top of It?

So is there a way for me to overlay a canvas over a div of the same size, and have the both the div and canvas each with their own respective mouseevent handlers to process the mouseclick, mouseover, and mousemove events despite the canvas开发者_如何学运维 being on top of it? If so, how do I accomplish this?

Put the <canvas> as a child of the <div>, i.e. <div><canvas></canvas></div>. The events occurring on the canvas will bubble to the div, and you can handle them twice.

Whats wrong with just having one method call the other?

http://jsfiddle.net/ZCuL6/9/

Or if they are the same size and you always want them called at once, perhaps you should simply have one method for all mouse events, and always have those methods exist on the top-most object of your layering.