Just set the <canvas>'s z-index to -1. If your canvas is covered by containers on top, simulate custom events using createEvent https://developer.mozilla.org/en-US/docs/Web/API/event.initMouseEvent.[1] https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events/Creating_and_triggering_events
Demo: http://jsfiddle.net/DerekL/uw5XU/ http://jsfiddle.net/DerekL/uw5XU/
var canvas = $("canvas"), //jQuery selector, similar to querySelectorAll()
//...
function simulate(e) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("mousemove", true, true, window,
0, e.screenX, e.screenY, e.clientX, e.clientY, false, false, false, false, 0, null);
canvas[0].dispatchEvent(evt);
}
$("body > *").each(function () {
this.addEventListener("mousemove", simulate);
});
