html5 css3玻璃效果与折射

Question

使用html，css，javascript可以用'折射'显示玻璃效果吗？

我在css中设置了一个html div“pop up”样式（例如：background：rgba（255,255,255,0.5））以显示透明。我希望弹出窗口下方的html页面部分由于折射而显得扭曲。弹出窗口的前景或背景中没有使用任何图像。底层的html页面是动态的，可以有图像。

Answer 1

如果您的背景是画布，则可以使用焦散来创建弹出窗口大小和位置的折射图像。见http://www.klayge.org/material/3_12/Caustics/fastcaustics.pdf

Here is a nice demo of caustics using canvas.