Как сделать падающий снег на сайте (вариант 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. #31 написал: Kali4
    Группа: Гости
    13 января 2009 11:03

    Здорово, добавил в закладки.
    • 0

       

  2. #32 написал: logopedrst
    Группа: Гости
    14 января 2009 05:03

    грамотно реализовано
    • 0

       

  3. #33 написал: gerbttops
    Группа: Гости
    14 января 2009 12:52

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

       

  4. #34 написал: Nikittronik
    Группа: Гости
    15 января 2009 02:18

    Кслевая тема.
    • 0

       

  5. #35 написал: privateporno
    Группа: Гости
    16 января 2009 18:34

    Слышал, но отнеся к этому более философски
    • 0

       

  6. #36 написал: emogirl
    Группа: Гости
    17 января 2009 01:13

    Респект!
    • 0

       

  7. #37 написал: kostass
    Группа: Гости
    17 января 2009 17:40

    Немогу не поблагодарить автора, спасибо.
    • 0

       

  8. #38 написал: avtonnaftik
    Группа: Гости
    17 января 2009 18:47

    молоцом.
    • 0

       

  9. #39 написал: rddikks
    Группа: Гости
    17 января 2009 19:11

    Как сейчас многие любят говрить, спасибо.
    • 0

       

  10. #40 написал: sardelikas
    Группа: Гости
    17 января 2009 22:50

    креативное начало
    • 0

       

  11. #41 написал: Karpatnnik
    Группа: Гости
    18 января 2009 02:39

    молоцом.
    • 0

       

  12. #42 написал: Irishka-87
    Группа: Гости
    18 января 2009 05:09

    Приятно, сидя на работе. Отвлечься, от этой надоевшей работы. Расслабиться, и читать написанную тут информацию :)
    • 0

       

  13. #43 написал: Programisstig
    Группа: Гости
    18 января 2009 07:57

    Как сейчас многие любят говрить, спасибо.
    • 0

       

  14. #44 написал: AlexRudas
    Группа: Гости
    18 января 2009 13:31

    Очень гуд.
    • 0

       

  15. #45 написал: konstanntin
    Группа: Гости
    18 января 2009 18:08

    Понравилос.
    • 0

       

  16. #46 написал: Маруська
    Группа: Гости
    18 января 2009 23:37

    Прикольно
    • 0

       

  17. #47 написал: phishkagooodd
    Группа: Гости
    19 января 2009 18:21

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

       

  18. #48 написал: hyipneres
    Группа: Гости
    19 января 2009 19:08

    что тут скажешь...
    • 0

       

  19. #49 написал: Masha17
    Группа: Гости
    19 января 2009 22:44

    Обилие интересных статей на вашем сайте меня поражает! Автору – удачи и новых интересных постов!
    • 0

       

  20. #50 написал: zaharkev
    Группа: Гости
    19 января 2009 22:51

    новость что надо smile
    • 0

       

  21. #51 написал: lopipserur
    Группа: Гости
    20 января 2009 14:25

    Буду рекомендовать!
    • 0

       

  22. #52 написал: Allexxxey
    Группа: Гости
    21 января 2009 01:44

    Кслевая тема.
    • 0

       

  23. #53 написал: Aliiiskka
    Группа: Гости
    21 января 2009 09:17

    Спасибо за информационную темку!!
    • 0

       

  24. #54 написал: Kinstintinchikk
    Группа: Гости
    21 января 2009 09:21

    Кслевая тема.
    • 0

       

  25. #55 написал: alefapopovich
    Группа: Гости
    21 января 2009 14:23

    ссылку кинул друг, клас smile smile
    • 0

       

  26. #56 написал: Azoveecc
    Группа: Гости
    21 января 2009 22:39

    Как сейчас многие любят говрить, спасибо.
    • 0

       

  27. #57 написал: djRicordi
    Группа: Гости
    22 января 2009 01:01

    Новости стали лучше.
    • 0

       

  28. #58 написал: siriusman
    Группа: Гости
    22 января 2009 01:15

    вот это клас, спасибо smile
    • 0

       

  29. #59 написал: AndrewSmiler
    Группа: Гости
    22 января 2009 11:03

    Интересно и актуально, спасибо !
    • 0

       

  30. #60 написал: humordedal
    Группа: Гости
    22 января 2009 16:56

    респект автору
    • 1

       

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


@

  • 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