将一张画布放在另一张画布上方的问题

【问题标题】：Problems with placing one canvas above another one将一张画布放在另一张画布上方的问题
【发布时间】：2023-03-16 19:48:01
【问题描述】：

var origCanv=document.getElementById("canvas1");
var canv=document.createElement("CANVAS");
document.body.appendChild(canv);
canv.width=origCanv.width;
canv.height=origCanv.height;
var rect=origCanv.getBoundingClientRect();
canv.style.position="fixed";
canv.style.top=rect.top;
canv.style.left=rect.left;
canv.style.zIndex=999999;

如果我设置绝对位置，画布可以看到，但不是在正确的位置，如果我把它固定，我根本看不到它！！！

【问题讨论】：

标签： javascript html dom canvas

【解决方案1】：

尝试在top 和left 属性上添加单位说明符并使用position:absolute。

canv.style.position = 'absolute';
canv.style.top = rect.top + 'px';
canv.style.left = rect.left + 'px';

可能还想使用健全的 z-index。如果 canvas1 没有定位，则不需要索引。否则尝试最低数字> canvas1.style.zIndex

这是jsfiddle

【讨论】：