Снежные эффекты не пользуются популярностью в Интернете. Некоторые могут подумать что они немного безвкусные, но нет ничего, что говорило бы о Рождестве так, как несколько снежинок, мягко скользящих по экрану.
Да будет снег!
Итак, вариант номер один. На рисунке ниже изображен снег, который не только падает с неба (довольно важная функция, я знаю), но и избегает вашего курсора!
See the Pen Its snowing! by Loktar (@loktar00) on CodePen.
Эффект снежной бури
Далекие размытые снежные хлопья - не твое дело? Что ж, для тебя тоже есть снежинки — яркие и смелые 🙂
See the Pen Snow by pimskie (@pimskie) on CodePen.
Снег, который движется вместе с курсором
А как насчет возможности контролировать направление ветра с помощью мыши?
See the Pen Happy Xmas! by Paul Neave (@neave) on CodePen.
Метель!
Разместите метель на своем сайте — что может пойти не так?
See the Pen Midnight Snow by Tiffany Rayside (@tmrDevelops) on CodePen.
Снег на чистом CSS
Самое простое решение - вставить в HTML "снежинки" (div-ы) и CSS-код и вуаля! 🙂
See the Pen Snow (Pure CSS) by alphardex (@alphardex) on CodePen.
Как живой с WebGL
Видели более реалистичный снег в интернете? Даже направление ветра меняется если подождать немного 🙂
See the Pen Snowfall WebGL Shader by Boris Šehovac (@bsehovac) on CodePen.
Спокойный и стильный Fargo404
Талантливый Nate Watson разработал такую вот страничку 404 со снегопадом.
See the Pen Fargo 404 by Nate Watson (@nw) on CodePen.
Размытый фон, размытый снег 🙂
Если вам нужен спокойный фон, не забирающий на себя внимание — этот вариант в самый раз!
See the Pen Pure CSS Snow by Emmanuel Pilande (@epilande) on CodePen.
Просто и стильно
И самый спокойный вариант снега на вашу страничку. Отлично подойдет для виртуальных открыток или отдельной страницы-поздравления для клиентов или сотрудников.
See the Pen #codevember -22 Countdown to Christmas! by Sasha (@sashatran) on CodePen.
И еще красивый снегопад
Казалось бы — просто снег, просто падает. Но сколько разных их бывает! Вот еще один красивый вариант снегопада. Чтобы установить достаточно добавить в тело страницы элемент canvas и инициализировать его java-скриптом:
See the Pen SnowFlakes by Rainner Lins (@rainner) on CodePen.
