Эффект стекла html5 css3 с преломлением

Question

Можно ли показать эффект стекла с помощью «преломления», используя html, css, javascript?

У меня есть html div "pop-up", стилизованный под css (например: background: rgba (255,255,255,0.5)), чтобы казаться прозрачным. Я хочу, чтобы часть html-страницы под всплывающим окном выглядела искаженной из-за преломления. Изображения не используются на переднем плане или фоне всплывающего окна. Основная HTML-страница является динамической и может содержать изображения.

Answer 1

Если ваш фон - холст, вы можете использовать каустику для создания преломленного изображения размером и положением вашего всплывающего окна. см http://www.klayge.org/material/3_12/Caustics/fastcaustics.pdf

Вот хорошая демонстрация каустики с использованием canvas.