css – 如何使WebGL画布透明

前端之家收集整理的这篇文章主要介绍了css – 如何使WebGL画布透明前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
WebGL画布是否可以透明背景?
我想通过画布可以看到网页的内容.

这是我现在的:http://i50.tinypic.com/2vvq7h2.png

您可以看到,WebGL画布背后的文本是不可见的.当我改变CSS中的Canvas元素的样式并添加

opacity: 0.5;

页面将如下所示:
http://i47.tinypic.com/302ys9c.png

这几乎是我想要的,但不完全 – 由于CSS alpha设置的文本颜色当然不是相同的黑色和蓝色的颜色与第一张图片不一样的蓝色.

感谢任何帮助!

解决方法

默认情况下,WebGL支持Alpha透明度,但必须使用它.最基本的,在你的gl.clear操作之前,确保你将清晰的颜色设置为transparent,gl.clearColor(0,0).

如果您想要绘制半透明对象,则可以进行混合操作和排序绘图,但是您只是希望未绘制的区域是透明的,以上是足够的.

猜你在找的CSS相关文章