Скрипт, реализующий данную анимацию, работает на библиотеке TweenMax

Пример:

HTML:

CSS:

JS:

Подключаем библиотеку TweenMax.min.js и скрипт самой анимации:

Где:

n - Кол-во снежинок

speed - Их скорость.

wind - Ветер (наклон снежинок)

windVariance - Отклонение снежинок, 1 = без отклонения.

ch - Высота блока

cw - Ширина блока.

img.src - Снежинка в base64

Фон канваса задается через CSS

Заменив изображение img.src, с неба могут падать смайлики, наковальни и другие предметы.

Найдено на codepen.io у пользователя Tom Miller
Автор фотографии cgcowboy

Смотрите также:

Эффект со случайным турбулентным фоном для блока или секции

Красивые эффекты с использованием Canvas и jQuery для анимации фона блока или страницы. Часть 1

Эффект искажения фотографии основанный на WebGL, похожий на нахождение под водой

Добавить комментарий:

Ваш комментарий отправлен!