我有一个用HTML设置的圆形图像蒙版,用于覆盖图像。
以下是供参考的代码:
<div id="group-focus">
<svg height="800" viewbox="0 0 1000 800">
<defs>
<mask id="text-mask" maskUnits="userSpaceOnUse"
maskContentUnits="userSpaceOnUse">
<circle cx="600" cy="400" r="400" fill="white">
</mask>
</defs>
<!-- this is the image that I masked -->
<g mask="url(#text-mask)">
<image id="text-focus" width="2560" height="1440"
y="0" x="0" xlink:href="img/Asset13x.png" />
</g>
</svg>
</div>
因为我已将HTML中的蒙版大小设置为所需的大小,所以不确定如何将蒙版扩展为其他大小。您可以在Javascript中制作面具动画吗?这是我目前正在研究的运动图形项目。
谢谢!