Вопрос по верстке: как сделать эффект стекания капель

G1
На сайте с 06.08.2010
Offline
196
931
На одном сайте нужно реализовать эффект запотевания страницы. Сайт – производитель лимонада. Если на странице 10 секунд ничего не трогать, то страница должна медленно начать запотевать, потом должны начать скатываться капли. При передвижении мыши должен воспроизводиться эффект того, что кто-то пальцем проводит по запотевшему стеклу, а при клике мышкой – полное очищение экрана.

Как такое можно реализовать с помощью каких технологий?

Если кто-то видел похожий эффект на каком либо сайте, скиньте URL-ы, пожалуста.

ДП
На сайте с 23.11.2009
Offline
203
#1

Готового решения не видел, а так из мыслей - css-фильтр blur, картинки капель в случайных местах. Это для появления эффекта.

Для стирания - не знаю, возможно что-то на svg или canvas придётся делать.

Почему-то вспомнилось http://bash.im/quote/435718

Q8
На сайте с 02.08.2012
Offline
31
#2

что-то типа такого не смотрели?: http://maroslaw.github.io/rainyday.js/

покликайте по демкам. мне кажется первый этап задания можно смоделировать.

а вот как дальше быть...

ПЗ
На сайте с 10.10.2006
Offline
92
#3
Автомобили в России (http://www.autobb.ru/). Спецтехника BIZ - вся строительная, дорожная, коммунальная техника (http://www.spectehnika.biz/) и другая спецтехника в одном месте.
WebJunior
На сайте с 11.06.2010
Offline
155
#4

ff рендерит страницу с частотой 2 кадра в секунду. комп не самый слабый.

это как бы ответ - а зачем оно нужно?

Мой сайт на этом хостинге - https://tuthost.ua/?from=2558 / Верстаю шаблоны (темы с отзывами: https://searchengines.guru/ru/forum/763758, https://searchengines.guru/ru/forum/600404 ).
G1
На сайте с 06.08.2010
Offline
196
#5

Есть еще варианты?

http://maroslaw.github.io/rainyday.js/ вот такого рода готовые варианты было бы отлично, чтобы посмотреть и выбрать

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий