Падащ сняг на място
Добър ден и честита нова година. В навечерието на Нова година искам да споделя с вас един много лек, красив и непретенциозен плъгин за падащ сняг. Този скрипт е наистина много лек и лесно може да бъде поставен в html файл, без да усложнява работата със самия html код на сайта. Вярно, може да се извади в отделен файл. Но за удобство направих всичко в един файл.
Тук няма какво да се каже, по-добре е да видите демонстрация на този падащ сняг. Освен това има много красив фон и надпис "Честита Нова година", изписан с красив шрифт "Lobster" от Google. Можете лесно да превърнете този файл в интернет картичка с поздравления.
Свързване на скрипта на падащите снежинки към готовия сайт
1. Включете библиотеката jQuery
Свързва се така: между таговете и вмъкнете следния код:
2. Свържете стилове
Поставете css кода във вашия css файл (обикновено style.css):
3. Създайте файл snow.js
Нека създадем файл snow.js и да поставим следния javascript код там:
Включете js файл в:
4. Въведете html код
Е, остава най-важното - вмъкнете html кода на падащия сняг на произволно място в:
Ако сте направили всичко правилно, тогава сняг ще започне да пада върху вашия сайт.
Свързване на фоново изображение, голям хедър и падащи снежинки
Този вариант е различен по това, че има фоново изображение и голямо заглавие „Честита Нова година“. Свързването на тази версия на скрипта за падащ сняг към сайта е доста просто. Трябва да:
1. Изтеглете архива и го разархивирайте
2. Включете библиотеката jQuery
Не забравяйте да включите библиотеката jQuery (не е необходимо, ако вече имате включена тази библиотека).Свързва се така: между таговете и вмъкнете следния код:
3. Свържете шрифта "Lobster"
Подобно на включването на библиотеката jQuery, ние включваме шрифта за нашия надпис "Честита Нова Година":
Естествено, ако не се нуждаете от този надпис и шрифт, можете да не го включите, но след това в css премахнете атрибута "font-family: 'Lobster', cursive;" от атрибута H1 или го заменете със собствен шрифт
4. Включително стилове
Опция A. Поставете css кода във вашия css файл. Ето кода:
Опция Б. Можете също да създадете отделен файл, например snow.css и да поставите същия код там, въпреки че ще трябва да бъде включен в главата, както следва:
5. Свържете сценария за падащ сняг
Опция A. За да направим това, трябва да вмъкнем в най-долната част на сайта (преди затваряне