Скрипт падающего снега на сайт: js
Опубликовано: 01.09.2018
К новому году хочется выделить как то свой сайт в этот праздник. Скрипт падающего снега создаст новогоднее настроение.
Демонстрация
Для этого мы будем использовать js-скрипт, который легко подключается.
Сначала скачаем его (+ в комплект идёт три вида снежинок).
Скачать в zip Ссылка на Github
Затем загрузим js-файл и картинки к себе на сайт и подключаем скрипт перед закрывающим тегом </body>.
Простые снежинки (без картинки)
Падающий снег
<script src="js/snowfall.js"></script> <script type="text/javascript"> (document).ready(function(){ $(document).snowfall(); }); </script>
Снежинки с картинкой
<script src="js/snowfall.js"></script> <script type="text/javascript"> (document).ready(function(){ $(document).snowfall({image :"assets/img/snow4.png", minSize: 10, maxSize:20}); }); </script>Параметры:
| flakeCount | Количество снежинок на странице (одновременно) |
| flakeColor | Цвет снежинок |
| minSize | Минимальный размер снежинки |
| maxSize | Максимальный размер снежинки |
| maxSpeed | Максимальная скорость |
| minSpeed | Минимальная скорость |
| round | Округление снежинок (значение true или false) |
| shadow | Тень снежинок (значение true или false) |
Пример вызова с параметрами
<script type="text/javascript"> (document).ready(function(){ $(document).snowfall({ flakeCount: 300, image :"assets/img/snow4.png", minSize: 10, maxSize:20, round: true, shadow: false, }); }); </script>Если у вас нет возможности загрузить скрипт на свой сайт, то подключитесь к нему удалённо.
Просто вставьте этот код и скрипт запустится.
<script src="https://daruse.ru/assets/js/snowfall.js"></script> <script type="text/javascript"> $(document).snowfall(); </script>