Скрипт падающего снега на сайте

Скрипты и советы | 13 октября 2009

снег на сайте

Скрипт падающего снега на сайте


Как сделать падающий снег на сайте

Скрипт падающего снега обычно используют перед новым годом
Собственно все элементарно! В тело html страницы вставляем Ява-скрипт и на сайте уже падает снег.
Но я предлагаю более изящное решения для сайтов на основе движка ДЛЕ,
Для начало переходим в админку, в ней находим раздел «Рекламные материалы»

Скрипт падающего снега на сайте


В нем создаем новый баннер
Название баннерного поля: пишем sneg
Описание баннера: например «падающие снежинки»

Скрипт падающего снега на сайте


В тело баннера вводим код:
<script><!-- Begin// требования: только поддержка JAVA и все.// скрипт всегда должен вставлятся сразуже после тега body иначе он не будет работать//создайте обязательно самостоятельно рисунок (sneg.gif)или пропишите путь ниже.// если Вы хотите преукрасить свой сайт то это то что нужноvar no = 20; // количество снежинокvar speed = 20; // скорость снежинокvar snowflake = "sneg.gif"; //рисунок который будет дататьvar ns4up = (document.layers) ? 1 : 0;var ie4up = (document.all) ? 1 : 0;var dx, xp, yp;var am, stx, sty;var i, doc_width = 800, doc_height = 600;if (ns4up) {doc_width = self.innerWidth;doc_height = self.innerHeight;} else if (ie4up) {doc_width = document.body.clientWidth;doc_height = document.body.clientHeight;}dx = new Array();xp = new Array();yp = new Array();am = new Array();stx = new Array();sty = new Array();for (i = 0; i < no; ++ i) {dx[i] = 0;xp[i] = Math.random()*(doc_width-50);yp[i] = Math.random()*doc_height;am[i] = Math.random()*20;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();if (ns4up) {if (i == 0) {document.write("<layer name="dot"+ i +"" left="25" ");document.write("top="25" visibility="show"><img src="");document.write(snowflake + "" border="0"></layer>");} else {document.write("<layer name="dot"+ i +"" left="25" ");document.write("top="25" visibility="show"><img src="");document.write(snowflake + "" border="0"></layer>");}} else if (ie4up) {if (i == 0) {document.write("<div id="dot"+ i +"" style="POSITION: ");document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");document.write("visible; TOP: 25px; LEFT: 25px;"><img src="");document.write(snowflake + "" border="0"></div>");} else {document.write("<div id="dot"+ i +"" style="POSITION: ");document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");document.write("visible; TOP: 25px; LEFT: 25px;"><img src="");document.write(snowflake + "" border="0"></div>");}}}function snowNS() {for (i = 0; i < no; ++ i) {yp[i] += sty[i];if (yp[i] > doc_height-50) {xp[i] = Math.random()*(doc_width-am[i]-30);yp[i] = 0;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();doc_width = self.innerWidth;doc_height = self.innerHeight;}dx[i] += stx[i];document.layers["dot"+i].top = yp[i];document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);}setTimeout("snowNS()", speed);}function snowIE() {for (i = 0; i < no; ++ i) {yp[i] += sty[i];if (yp[i] > doc_height-50) {xp[i] = Math.random()*(doc_width-am[i]-30);yp[i] = 0;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();doc_width = document.body.clientWidth;doc_height = document.body.clientHeight;}dx[i] += stx[i];document.all["dot"+i].style.pixelTop = yp[i];document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);}setTimeout("snowIE()", speed);}if (ns4up) {snowNS();} else if (ie4up) {snowIE();}// End --></script>


В корень нашего сайта записываем картинку со снежинкой на мой взгляд оптимальный размер 15х15 пикселей.
имя файла должн быть sneg.gif

Далее полученый нами тег баннера в виде {banner_sneg} нам необходимо добавить в наш шаблон основной страницы сайта.

Скрипт падающего снега на сайте


в основном разделе админки выбираем Шаблоны сайта
в данном разделе находим Общий макет страницы

Скрипт падающего снега на сайте


в нем ищем тег body
<body>{AJAX}{banner_sneg}

и сразу после тега AJAX прописываем свой тег баннера со снегом.

Скрипт падающего снега на сайте


сохраняем изменения в шаблоне.

Теперь если вы все сделали правильно у вас при заходе на главную страницу сайта будет идти снег :))
настройки по умолчанию показывают 20 снежинок которые падают с высоты 600 пикселей (т.е. в среднем на высоту одного экрана браузера)

Скрипт падающего снега на сайте в качестве исходной снежинки для заливки на свой сайт можно использовать нашу.

Кстати, если снежинки надоедят, Вам никто не мешает скажем осенью заменить снежинку на желтый лист :-) будет листопад.

Если снежинки надоели, достаточно в разделе сайта "Управление рекламой" отключить отображение банера sneg

PS: работающие снежинки можно посмотреть на проекте Ana-sm.ru
Как сделать падающий снег на сайте (вариант 2)

Для всех тех, кто хочет видеть на своем сайте пдающий снег, но кому не подошел вариант описанный в новости "скрипт...

Подробнее
Падающий снег на сайт с помощью jQuery

Еще один способ сделать падающие снежинки на сайт в канун Нового года. В этот раз помог сайт my-dle.ru на котором и был...

Подробнее
Снег на сайте - Jquery плагин

Наиболее современный способ реализации падающего снега на вашем сайте, работающем на движке DLE. Все, что требуется -...

Подробнее
Снег на сайте для DLE

Очередная реализация снежинок для сайта - создаем новогоднее настроение средствами JS. Вывод снежинок организуем через...

Подробнее
Модуль DLE-convert.xfields

Скрипт конвертации формата дополнительного поля новостей для DataLife Engine тип поля: text в новый тип поля: yesorno...

Подробнее
Как добавить title на основе alt у тега img

В свежих версиях движка DLE пропала полезная функция - вывод атритуба title для изображений. Теперь она заменена на...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms/

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями

  1. fellow ОГРОМНОЕ СПАСИБО!!!!!! Шикарный скрипт!!!!!!! Долго искал, и,как ни странно,тлоько сейчас наткнулся на стлоько удобно расписанный и пояснённый скрипт!!!!!!!!! СПАСИБО!
    Schuldig Schuldig 7 марта 2008 09:54
  2. Работает данный скрипт только в браузере IE.
    marcel marcel 6 декабря 2008 17:20
  3. угу, в том году везде работал, а сейчас только в IE - разбираемся в чем дело..
    Ana Ana 11 декабря 2008 14:13
  4. Починили второй вариант скрипта доступный по ссылке https://tcse-cms.com/main/sovet/72-kak-sd

    el...-na-sajjte.html://http://tcse-cms.c
    om/main/sovet/72-k...-na-sajjte.html

    работает во всех популярных рунетовский браузерах Opera, Firefox, IE,
    так что рекомендую именно этот скрипт
    TCSE TCSE 11 декабря 2008 17:53
  5. помогите! у меня снежинки летают, но они почемуто в серых рамках, как убрать рамки? вот скриншот: http://pic.ipicture.ru/uploads/081213/84
    19/1M5ayUtSwa.jpg
    заранее спасибо!
    lolovich lolovich 13 декабря 2008 10:02
  6. данный вариант скрипта как я понял сделан под браузер ИЕ в остальных он криво работает или вообще не отображается :(
    пробуйте второй вариант скрипты.
    TCSE TCSE 13 декабря 2008 15:11
  7. lolovich: У тебя просто снежинки не на прозрачном фоне.
    Skynet Skynet 23 декабря 2008 16:42
  8. а снежинки только на РНР могут летать или на HTML сайтах тоже можно сделать
    ZICKFREED ZICKFREED 29 декабря 2008 09:08
  9. а снежинки только на РНР могут летать или на HTML сайтах тоже можно сделать


    конечно на голом html
    TCSE TCSE 29 декабря 2008 13:23
  10. Cпасибо!!!

    Блин, народ какое сегодня число?
    Zoolalaxy Zoolalaxy 20 октября 2009 17:07
  11. Zoolalaxy,
    Посмотри на дату написания вопроса..... wink
    Борис Борис 23 ноября 2011 18:08