Як зробити сніг на сайті

Як зробити сніг на сайті

Дизайн є важливою частиною кожного web-сайту. Саме на підставі дизайну у користувачів складається перше враження про ресурс. Тому кожен, навіть початківець web-майстер, приділяє дизайну сайтів першорядне значення. Багато web-майстри намагаються слідувати новітнім концепціям web-дизайну, доповнюють сторінки барвистим динамічним вмістом і навіть змінюють оформлення сайту відповідно до пори року, календарем свят чи історичних подій. Саме тому напередодні нового року форуми, присвячені web-розробки, починають пістрявити темами з питанням про те, як зробити сніг на сайті.

Вам знадобиться

Браузер. Можливість редагування сторінок, шаблонів сторінок або файлів тим web-сайту. Доступ до сервера сайту по протоколу FTP. Програма FTP-клієнт або файловий менеджер з підтримкою роботи з FTP.

Інструкція

  1. Завантажте скрипт, що відображає падаючий сніг на сайті. Відкрийте в браузері сторінку http://codeguru.ru/web/javascript/. Перейдіть в розділ «Приклади скриптів на JavaScript» -> «Анімація» -> «Рухомі об’єкти». Клацніть по посиланню «Скрипт Падаючий сніг». На сторінці, вгорі праворуч натисніть на посилання «snowfall.zip». Збережіть архів зі скриптом на жорсткий диск свого комп’ютера.
  2. Розпакуйте архів зі скриптом. Вийміть всі файли із завантаженого архіву в тимчасову папку на жорсткому диску. Скористайтеся програмою-Розпакувальник, або файловим менеджером.
  3. Налаштуйте скрипт. Відкрийте файл snowfall.js в будь-якому текстовому редакторі. Змініть значення властивостей nCount, nMaxSpeed ​​і strFlakeURL об’єкта oSnowFall. Значення nCount визначає, скільки зображень сніжинок одночасно рухатиметься на сторінці. Значення nMaxSpeed ​​задає максимальну швидкість руху сніжинки в пікселях за одну ітерацію роботи скрипта. Параметр strFlakeURL повинен містити коректний URL зображення сніжинки, за яким воно може бути завантажено через web.
  4. Завантажте файли скрипта, таблиці стилів і зображення сніжинки на сервер. З’єднайтесь з сервером сайту по протоколу FTP. Перейдіть в папку, призначену для файлів клієнтських скриптів, або ж створіть подібну папку і перейдіть у неї. Завантажте в неї файл snowfall.js. Перейдіть в папку, призначену для графічних зображень. Завантажте в неї файл snowflake.gif. Додайте на сервері файл snowfall.css.
  5. Зробіть сніг на сайті. Відредагуйте код сторінок, шаблони сторінок, або файли тим сайту так, щоб в елементі HEAD результуючого коду містилася рядка виду:

    <link rel=»stylesheet» type=»text/css» href=»адрес_css_файла»>

    <script type=»text/javascript» src=»адрес_js_файла»> </ script>

    де адрес_css_файла і адрес_js_файла — адреси файлів snowfall.css і snowfall.js в web.

    Відразу після відкриваючого тега <body> помістіть рядок:

    <div id=»ID_ANIMATE»>

    Також перед закриває тегом </ body> помістіть рядки:

    </ Div>

    <script type=»text/javascript»>

    <! -

    DoSnowFall ();

    / / ->

    </ Script>

    Збережіть результати редагування.
  6. Перевірте результат. Відкрийте кілька сторінок сайту, на які було запроваджено скрипт. Анімація повинна початися негайно після закінчення завантаження сторінок.

Зверніть увагу

Не вибирайте занадто велике значення параметра nCount, це може стати причиною уповільнення роботи браузера користувача.

Корисні поради

Розробіть своє зображення сніжинки і замініть ім файл snowflake.gif для надання більшої оригінальності сторінок сайту.