Javascript元素不透明度情况

假设我有一个div元素，其不透明度设置为0.5

我有一个脚本，它的功能是根据用户第一次用鼠标左键单击div元素以及他在div上拖动鼠标的方式，在div上绘制一个矩形

我试图找出如何使用户绘制的矩形不受div容器元素不透明度的影响

---

例如，如果你上传一张照片到google+上，有一个选项可以裁剪图像的某些部分，这样只有你的脸可见。他们有这种功能，我正在寻找。例如，在要裁剪的图像上绘制零件时，图像不透明度设置为0.5，但所绘制的区域清楚地显示了图像的原始样式。

包装元素的不透明度由所有包含元素继承

---

你可以简单地解决这个问题，用你想要的不透明度创建一个png图像，大小为1x1px，并将其作为背景图像，然后重复x和y，我想你要做的就是屏蔽，至少可以用svg实现。您可以有一个具有特定不透明度的图层和一个具有矩形属性的遮罩，以便在所需位置的不透明度中“烧掉一个洞”

看看这个：

---

你正在尝试……那很好，我们该怎么办？：）我正在找人给我一个解决方案：）