Как сделать падающий снег на сайте (вариант 2)


Как сделать падающий снег на сайте (вариант 2)


Для всех тех, кто хочет видеть на своем сайте пдающий снег, но кому не подошел вариант описанный в новости "скрипт падающего снега для ДЛЕ" предлагаю к рассмотрению второй вариант. Он не требует загрузки на свой сайт никаких графических файлов. достаточно в тело страницы вставить код и вуаля: снежок пошел :-)

Для сайтов на основе ДЛЕ все делается как и описано в прошлой новости за исключение кода для баннера.
В качестве кода мы будем вставлять следующие:

<script type="text/javascript">/******************************************* Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html)* Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code* Last updated Nov 9th, 05' by DD. This notice must stay intact for use******************************************/    //Configure below to change URL path to the snow image  var snowsrc="http://tcse-cms.com/sneg/sneg.gif"  // Configure below to change number of snow to render  var no = 10;  // Configure whether snow should disappear after x seconds (0=never):  var hidesnowtime = 0;  // Configure how much snow should drop down before fading ("windowheight" or "pageheight")  var snowdistance = "pageheight";///////////Stop Config//////////////////////////////////  var ie4up = (document.all) ? 1 : 0;  var ns6up = (document.getElementById&&!document.all) ? 1 : 0;    function iecompattest(){    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body    }  var dx, xp, yp;    // coordinate and position variables  var am, stx, sty;  // amplitude and step variables  var i, doc_width = 800, doc_height = 600;     if (ns6up) {    doc_width = self.innerWidth;    doc_height = self.innerHeight;  } else if (ie4up) {    doc_width = iecompattest().clientWidth;    doc_height = iecompattest().clientHeight;  }  dx = new Array();  xp = new Array();  yp = new Array();  am = new Array();  stx = new Array();  sty = new Array();  snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc  for (i = 0; i < no; ++ i) {      dx[i] = 0;                        // set coordinate variables    xp[i] = Math.random()*(doc_width-50);  // set position variables    yp[i] = Math.random()*doc_height;    am[i] = Math.random()*20;         // set amplitude variables    stx[i] = 0.02 + Math.random()/10; // set step variables    sty[i] = 0.7 + Math.random();     // set step variables        if (ie4up||ns6up) {      if (i == 0) {        document.write("<div id="dot"+ i +"" style="POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;"><a href="http://dynamicdrive.com"><img src='"+snowsrc+"' border="0"></a></div>");      } else {        document.write("<div id="dot"+ i +"" style="POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;"><img src='"+snowsrc+"' border="0"></div>");      }    }  }  function snowIE_NS6() {  // IE and NS6 main animation function    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;        doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;    for (i = 0; i < no; ++ i) {  // iterate for every dot      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();      }      dx[i] += stx[i];      document.getElementById("dot"+i).style.top=yp[i]+"px";      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";      }    snowtimer=setTimeout("snowIE_NS6()", 10);  }    function hidesnow(){        if (window.snowtimer) clearTimeout(snowtimer)        for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"    }        if (ie4up||ns6up){    snowIE_NS6();        if (hidesnowtime>0)        setTimeout("hidesnow()", hidesnowtime*1000)        }</script>


Для остальных сайтов, будь то динамические ресурсы на различных портальных системах или статические страницы на html
достаточно после тега
<body>
установить указанный мною выше код.

Такой вариант снега отображается во всех популярных браузерах рунета, а именно IE, Opera, Firefox

PS: этот вариант ява-скрипта был взять с форума ДЛЕ


Дополнение:

Вы можете самостоятельно указать место откуда скрипт должен забирать снежинку.
Для этого необхдимо в строке кода

  //Configure below to change URL path to the snow image  var snowsrc="http://tcse-cms.com/sneg/sneg.gif"  // Configure below to change number of snow to render  var no = 10;  // Configure whether snow should disappear after x seconds (0=never):  var hidesnowtime = 0;  // Configure how much snow should drop down before fading ("windowheight" or "pageheight")  var snowdistance = "pageheight";


ссылку https://tcse-cms.com/sneg/sneg.gif
заменить на нужную вам.
Например пусть вместо снега с неба падают ёлочки :-)
https://tcse-cms.com/sneg/ell.gif
или белые снежинки https://tcse-cms.com/sneg/sneg_w.gif


еще один вариант снега на сайт.

Хак. Падающий снег на javascript (не грузит проц!)
Собственно вот код, который вставляете в маин.тпл!
Я вставил после шапки, впринципе наверно можно вставить в любое место.
Там будут падать два вида снежинок.
Проц негрузит вообще!
Всех с наступающим!


<script language="javascript1.2">          grphcs=new Array(2);    Image0=new Image();    Image0.src=grphcs[0]="http://fantasyflash.ru/script/web/image/sneg1.gif";    Image1=new Image();    Image1.src=grphcs[1]="http://img1.immage.de/271211f747277a246b16fde4dfd36f00f3caa9e79c.gif";          Amount=15;      Ypos=new Array();    Xpos=new Array();    Speed=new Array();    Step=new Array();    Cstep=new Array();    ns=(document.layers)?1:0;    ns6=(document.getElementById&&!document.all)?1:0;          if (ns){    for (i = 0; i < Amount; i++){    var P=Math.floor(Math.random()*grphcs.length);    rndPic=grphcs[P];    document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");    }    }    else{    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');    for (i = 0; i < Amount; i++){    var P=Math.floor(Math.random()*grphcs.length);    rndPic=grphcs[P];//osw    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');    }    document.write('</div></div>');    }    WinHeight=160;    WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;    for (i=0; i < Amount; i++){            Ypos[i] = Math.round(Math.random()*WinHeight);          Xpos[i] = Math.round(Math.random()*WinWidth);          Speed[i]= 1.2;          Cstep[i]=0;          Step[i]=Math.random()*0.1+0.2;      }    function fall(){    var WinHeight=160;    var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;    var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;    var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;    for (i=0; i < Amount; i++){    sy = Speed[i]*Math.sin(90*Math.PI/180);    sx = Speed[i]*Math.cos(Cstep[i]);    Ypos[i]+=sy;    Xpos[i]+=sx;      if (Ypos[i] > WinHeight){    Ypos[i]=-60;    Xpos[i]=Math.round(Math.random()*WinWidth);    Speed[i]=1;    }    if (ns){    document.layers['sn'+i].left=Xpos[i];    document.layers['sn'+i].top=Ypos[i]+hscrll;    }    else if (ns6){    document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i]);    document.getElementById("si"+i).style.top=Ypos[i]+hscrll;    }    else{    eval("document.all.si"+i).style.left=Xpos[i];    eval("document.all.si"+i).style.top=Ypos[i]+hscrll;    }      Cstep[i]+=Step[i];    }    setTimeout('fall()',40);    }          window.onload=fall    //-->    </script>


код не проверял, оригинал нашел тут


Уважаемые посетители,
Если Вы хотите оставить заказ на разработку сайта или получить предварительную консультацию воспользуйтесь формой по ссылке ниже.
Обратная связь
Наш специалист ответит вам в течении суток.


15 декабря 2009  104 59 952   снег на сайте Версия для печати


Похожие публикации

Снег на сайте - Jquery плагин

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

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

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

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

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

Снег на сайте для DLE

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

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

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

TCSE_call-mod для DLE

Модуль «Обратный звонок» предназначен для вывода на сайте формы отправки менеджерам сайта информации с телефоном клиента (если он будет указан). Типовое применение - плавающая панель на корпоративном... читать далее

Комментарии (104)

  1. #61 написал: Nyastya7
    Группа: Гости
    23 января 2009 03:34

    Спасибо за статью! Надеюсь, автор не против, если я использую это для своей курсовой.
    • 0

       

  2. #62 написал: mikhander
    Группа: Гости
    23 января 2009 05:06

    Круто
    • 0

       

  3. #63 написал: gudvinmuk
    Группа: Гости
    23 января 2009 11:21

    грамотный автор
    • 0

       

  4. #64 написал: cratovogs
    Группа: Гости
    25 января 2009 00:33

    проверено временем
    • 0

       

  5. #65 написал: hillernea
    Группа: Гости
    25 января 2009 04:16

    креативный выпад!
    • 0

       

  6. #66 написал: mikhuliano
    Группа: Гости
    25 января 2009 17:28

    Эммм
    • 0

       

  7. #67 написал: brabullum
    Группа: Гости
    25 января 2009 17:51

    респект за этот выпуст
    • 0

       

  8. #68 написал: rublerrers
    Группа: Гости
    27 января 2009 05:09

    записал себе адрес
    • 0

       

  9. #69 написал: bubrikovers
    Группа: Гости
    27 января 2009 10:15

    отличная информация!
    • 0

       

  10. #70 написал: earnisers
    Группа: Гости
    28 января 2009 04:45

    респект и уважение автору
    • 0

       

  11. #71 написал: logometrus
    Группа: Гости
    28 января 2009 16:39

    мой вердикт - интересно!
    • 0

       

  12. #72 написал: wwwwqpwru
    Группа: Гости
    29 января 2009 03:00

    молоцом.
    • 0

       

  13. #73 написал: zerfiralera
    Группа: Гости
    29 января 2009 09:13

    Респект за этот топик
    • 0

       

  14. #74 написал: phishkaqwest
    Группа: Гости
    29 января 2009 20:41

    Класс! Большое спасибо!!! Добавил сайт в закладки.
    • 0

       

  15. #75 написал: hibeborez
    Группа: Гости
    30 января 2009 03:40

    грамотный выпад!
    • 0

       

  16. #76 написал: ivenik
    Группа: Гости
    1 февраля 2009 00:47

    Я бы еще кое-чего добавил конечно же, но по сути сказано практически все.
    • 0

       

  17. #77 написал: MoPIIe)(^^
    Группа: Гости
    13 марта 2009 10:58

    Мля как это нудно делать у меня есть скрипт он короткий его вставить на страницу сайта и готова а тут мазгу ... нада =(
    • 0

       

  18. #78 написал: readme
    Группа: Гости
    21 сентября 2009 00:58

    х.з уменя неработает когда добавляю на страницу с ресунками no -- а без нечего работает сцука http://jimmvista.wen.ru/javascript/love.
    html bully
    • 0

       

  19. #79 написал: SNEG
    Группа: Гости
    20 ноября 2009 12:45

    Спасибо большое за скрипт перепробовала кучу скриптов, но они не шли на мозиле, а этот идет, скажите в чем проблема, как адаптировать скрипты к мозиле?
    • 0

       

  20. #80 написал: fedor
    Группа: Гости
    25 ноября 2009 08:00

    спасибо, все подробно объяснил . дал 2 варинта молодца. у других на сайтах код не правильный. мои снежинки тут http://forum.longlives.ru fellow
    • 0

       

  21. #81 написал: Лерка-Валерка
    Группа: Гости
    2 декабря 2009 15:45

    Большое человеческое спасибо!!!!!!
    Радовалась - как ребенок Деду морозу)))
    С наступающим Вас!!
    • 0

       

  22. #82 написал: Talik
    Группа: Администраторы
    2 декабря 2009 15:47

    Цитата: Лерка-Валерка
    Большое человеческое спасибо!!!!!!


    пожалуйста. писали материал для людей а не для поисковых роботов - по этому и результат вышел правильный и понятный.
    • 0

       

  23. #83 написал: Stas
    Группа: Гости
    9 декабря 2009 19:25

    СПАСИБО !
    • 0

       

  24. #84 написал: Артем
    Группа: Гости
    14 декабря 2009 18:57

    Подскажите, пожалуйста, у меня снежинки летят можно сказать кучкой, тойсть летит полоса снежинок по странице... И получается пока до низу страницы не долетят у верху не появляются.
    Как можно сделать что бы постоянно на всю страницу летели, а не полосой.

    За ранее благодарен.
    • 0

       

  25. #85 написал: Talik
    Группа: Администраторы
    16 декабря 2009 11:03

    Цитата: Артем
    Подскажите, пожалуйста, у меня снежинки летят можно сказать кучкой, тойсть летит полоса снежинок по странице...


    уточните в каком веб-браузере проверяете
    • 0

       

  26. #86 написал: Lobnjak
    Группа: Гости
    18 декабря 2009 02:17

    Даже и не знаю…Вроде все толково, но, я думаю, все хорошо, как всегда, только не бумаге.
    • 0

       

  27. #87 написал: _f13_
    Группа: Гости
    21 декабря 2009 05:12

    Спасибо за снежинки, очень классно и в Опере работает)) с наступающим!))
    • 0

       

  28. #88 написал: matus
    Группа: Гости
    21 декабря 2009 23:29

    spasibo!!!
    • 0

       

  29. #89 написал: ketoh
    Группа: Гости
    25 декабря 2009 23:58

    Pavlik-jugend,
    Цитата: Pavlik-jugend
    оригинальная идея включать и выключать снег! см. "пусть всё растает" "пусть идёт снег"

    а не подскажите, как такое замутить?
    • 0

       

  30. #90 написал: ketoh
    Группа: Гости
    26 декабря 2009 00:02

    Pavlik-jugend,
    Цитата: Pavlik-jugend
    оригинальная идея включать и выключать снег! см. "пусть всё растает" "пусть идёт снег"

    а не подскажите, как такое замутить?
    • 0

       

Прокомментировать


@

  • bowtiesmilelaughingblushsmileyrelaxedsmirk
    heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
    winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
    worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
    expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
    disappointedconfoundedfearfulcold_sweatperseverecrysob
    joyastonishedscreamtired_faceangryragetriumph
    sleepyyummasksunglassesdizzy_faceimpsmiling_imp
    neutral_faceno_mouthinnocent

Архив сайта

Реклама на сайте
Студия создания и продвижения сайтов hover.com.ua