html5 css3玻璃效果與折射

是否有可能通過使用HTML，CSS，JavaScript顯示「折射」的玻璃效果？html5 css3玻璃效果與折射

我有一個html div「彈出」樣式在CSS（例如：background：rgba（255,255,255,0.5））顯示爲透明。我希望彈出下面的HTML頁面部分由於折射而出現扭曲。在彈出的前景或背景中不使用圖像。底層的html頁面是動態的，可以有圖像。

簡短的回答是「沒有」，很遺憾。這是可能的，但它可能會很不方便，你不想使用它。比如說，用一個大的JavaScript庫「捕捉」屏幕到Canvas上，然後模糊*，最後在後臺顯示它。 – Ryan 2012-01-14 17:39:40

不過，根據你的佈局，你*可能*能夠用過濾器吱吱作響。請參閱http://jsfiddle.net/minitech/rZ9cE/ – Ryan 2012-01-14 17:43:34

如果您的背景是一個畫布，您可以使用焦散法來創建折射圖像的大小和彈出位置。看到http://www.klayge.org/material/3_12/Caustics/fastcaustics.pdf

2012-02-02 08:50:19

以及bg和彈出窗口之間是否存在一些html？ – Joseph 2012-02-02 09:26:30

該問題已在這裏回答[link}（http://stackoverflow.com/questions/2732488/how-can-i-convert-an-html-element-to-a-canvas-element）。 – 2012-02-02 09:44:41

在我的實驗中，我發現當你扭曲圖像時，只需要圖像的近似值！ – 2012-02-02 09:55:43

回答