用canvas做遮罩层去遮住原始页面层，怎么设置类似z-index呢？

Question

之前直接设置z-index就行了， 现在用canvas的话，改如何设置，才能让canvas直接盖在原始页面上呢？
需要通用的方法，因为需要做多次。

Answer 1

可以在canvas外部套一个div。设置这个div为absolute，z-index大一点，做成一个遮罩层怎么样。

Answer 2

用canvas 做遮罩，实质上还是用的css的层叠样式属性z-index，所以何必绕那么大个圈

Answer 3

var canvas=document.getElementById("canvas"),
    ctx=canvas.getContext("2d");

ctx.globalCompositeOperation='source-over';

是你想要的效果吗？

详情可以查阅globalCompositeOperation属性：
https://developer.mozilla.org...

Answer 4

发现canvas其实可以设置z-index
<canvas id="mainCanvas" style="position:relative;z-index:1088;background: rgba(0,0,0,0.5);" > </canvas>