Jay*_*atz 8 javascript css html5 html5-canvas
有没有办法让HTML5画布成为我正在制作的网页的背景,并将所有元素放在它上面.
所以它的行为就像<body>?
我尝试使用z-index并将元素放在顶部,但随后它们可以点击或聚焦.我需要它们仍然可以正常运行,但画布也可以在后台单击,而不是可点击的,其中有元素.
只需将<canvas>'s 设置z-index为-1.如果您的画布由顶部的容器覆盖,请使用模拟自定义事件createEvent.[1]
演示: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);
});
Run Code Online (Sandbox Code Playgroud)