Новогодние украшения (скрипты) для сайта в 2022 году

Новогодние украшения для сайта
Каждый год вебмастера задаются одним и тем же вопросом - где найти новогодние украшения для сайта. Праздничное оформление радует глаз и, возможно, задерживает посетителя на сайте чуть дольше обычного. Главное, не переусердствовать со скриптами, чтобы посетителя не появился нервный тик после посещения вашего сайта.

Большинство кодов устанавливается размещением html в элемент блога. На WordPress - это виджет HTML-код, на ucoz добавляем новый блок в конструкторе.

Новогодние скрипты 2022

  1. Фейерверк, праздничный салют для блога:
    <script type="text/javascript">//<![CDATA[ function write_fire(e){var t,n,r;stars[e+"r"]=createDiv("|",12);boddie.appendChild(stars[e+"r"]);for(t=bits*e;t<bits+bits*e;t++){stars[t]=createDiv("*",13);boddie.appendChild(stars[t])}}function createDiv(e,t){var n=document.createElement("div");n.style.font=t+"px monospace";n.style.position="absolute";n.style.backgroundColor="transparent";n.appendChild(document.createTextNode(e));return n}function launch(e){colour[e]=Math.floor(Math.random()*colours.length);Xpos[e+"r"]=swide*.5;Ypos[e+"r"]=shigh-5;bangheight[e]=Math.round((.5+Math.random())*shigh*.4);dX[e+"r"]=(Math.random()-.5)*swide/bangheight[e];if(dX[e+"r"]>1.25)stars[e+"r"].firstChild.nodeValue="/";else if(dX[e+"r"]<-1.25)stars[e+"r"].firstChild.nodeValue="\\";else stars[e+"r"].firstChild.nodeValue="|";stars[e+"r"].style.color=colours[colour[e]]}function bang(e){var t,n,r=0;for(t=bits*e;t<bits+bits*e;t++){n=stars[t].style;n.left=Xpos[t]+"px";n.top=Ypos[t]+"px";if(decay[t])decay[t]--;else r++;if(decay[t]==15)n.fontSize="7px";else if(decay[t]==7)n.fontSize="2px";else if(decay[t]==1)n.visibility="hidden";Xpos[t]+=dX[t];Ypos[t]+=dY[t]+=1.25/intensity[e]}if(r!=bits)setTimeout("bang("+e+")",speed)}function stepthrough(e){var t,n,r;var i=Xpos[e+"r"];var s=Ypos[e+"r"];Xpos[e+"r"]+=dX[e+"r"];Ypos[e+"r"]-=4;if(Ypos[e+"r"]<bangheight[e]){n=Math.floor(Math.random()*3*colours.length);intensity[e]=5+Math.random()*4;for(t=e*bits;t<bits+bits*e;t++){Xpos[t]=Xpos[e+"r"];Ypos[t]=Ypos[e+"r"];dY[t]=(Math.random()-.5)*intensity[e];dX[t]=(Math.random()-.5)*(intensity[e]-Math.abs(dY[t]))*1.25;decay[t]=16+Math.floor(Math.random()*16);r=stars[t];if(n<colours.length)r.style.color=colours[t%2?colour[e]:n];else if(n<2*colours.length)r.style.color=colours[colour[e]];else r.style.color=colours[t%colours.length];r.style.fontSize="13px";r.style.visibility="visible"}bang(e);launch(e)}stars[e+"r"].style.left=i+"px";stars[e+"r"].style.top=s+"px"}function set_width(){var e=999999;var t=999999;if(document.documentElement&&document.documentElement.clientWidth){if(document.documentElement.clientWidth>0)e=document.documentElement.clientWidth;if(document.documentElement.clientHeight>0)t=document.documentElement.clientHeight}if(typeof self.innerWidth!="undefined"&&self.innerWidth){if(self.innerWidth>0&&self.innerWidth<e)e=self.innerWidth;if(self.innerHeight>0&&self.innerHeight<t)t=self.innerHeight}if(document.body.clientWidth){if(document.body.clientWidth>0&&document.body.clientWidth<e)e=document.body.clientWidth;if(document.body.clientHeight>0&&document.body.clientHeight<t)t=document.body.clientHeight}if(e==999999||t==999999){e=800;t=600}swide=e;shigh=t}var bits=80;var speed=33;var bangs=5;var colours=new Array("#03f","#f03","#0e0","#93f","#0cf","#f93","#f0c");var bangheight=new Array;var intensity=new Array;var colour=new Array;var Xpos=new Array;var Ypos=new Array;var dX=new Array;var dY=new Array;var stars=new Array;var decay=new Array;var swide=800;var shigh=600;var boddie;window.onload=function(){if(document.getElementById){var e;boddie=document.createElement("div");boddie.style.position="fixed";boddie.style.top="0px";boddie.style.left="0px";boddie.style.overflow="visible";boddie.style.width="1px";boddie.style.height="1px";boddie.style.backgroundColor="transparent";document.body.appendChild(boddie);set_width();for(e=0;e<bangs;e++){write_fire(e);launch(e);setInterval("stepthrough("+e+")",speed)}}};window.onresize=set_width//]]></script>
  2. Курсор в виде снега:
    <script type="text/javascript">var colour="blue";var sparkles=100;var x=ox=400;var y=oy=300;var swide=800;var shigh=600;var sleft=sdown=0;var tiny=new Array();var star=new Array();var starv=new Array();var starx=new Array();var stary=new Array();var tinyx=new Array();var tinyy=new Array();var tinyv=new Array();window.onload=function(){if(document.getElementById){var i,rats,rlef,rdow;for(var i=0;i<sparkles;i++){var rats=createDiv(3,3);rats.style.visibility="hidden";document.body.appendChild(tiny[i]=rats);starv[i]=0;tinyv[i]=0;var rats=createDiv(5,5);rats.style.backgroundColor="transparent";rats.style.visibility="hidden";var rlef=createDiv(1,5);var rdow=createDiv(5,1);rats.appendChild(rlef);rats.appendChild(rdow);rlef.style.top="3px";rlef.style.left="0px";rdow.style.top="0px";rdow.style.left="3px";document.body.appendChild(star[i]=rats)}set_width();sparkle()}}function sparkle(){var c;if(x!=ox||y!=oy){ox=x;oy=y;for(c=0;c<sparkles;c++)if(!starv[c]){star[c].style.left=(starx[c]=x)+"px";star[c].style.top=(stary[c]=y)+"px";star[c].style.clip="rect(0px, 5px, 5px, 0px)";star[c].style.visibility="visible";starv[c]=50;break}}for(c=0;c<sparkles;c++){if(starv[c])update_star(c);if(tinyv[c])update_tiny(c)}setTimeout("sparkle()",40)}function update_star(i){if(--starv[i]==25)star[i].style.clip="rect(1px, 4px, 4px, 1px)";if(starv[i]){stary[i]+=1+Math.random()*3;if(stary[i]<shigh+sdown){star[i].style.top=stary[i]+"px";starx[i]+=(i%5-2)/5;star[i].style.left=starx[i]+"px"}else{star[i].style.visibility="hidden";starv[i]=0;return}}else{tinyv[i]=50;tiny[i].style.top=(tinyy[i]=stary[i])+"px";tiny[i].style.left=(tinyx[i]=starx[i])+"px";tiny[i].style.width="2px";tiny[i].style.height="2px";star[i].style.visibility="hidden";tiny[i].style.visibility="visible"}};document['write']();function update_tiny(i){if(--tinyv[i]==25){tiny[i].style.width="1px";tiny[i].style.height="1px"}if(tinyv[i]){tinyy[i]+=1+Math.random()*3;if(tinyy[i]<shigh+sdown){tiny[i].style.top=tinyy[i]+"px";tinyx[i]+=(i%5-2)/5;tiny[i].style.left=tinyx[i]+"px"}else{tiny[i].style.visibility="hidden";tinyv[i]=0;return}}else tiny[i].style.visibility="hidden"}document.onmousemove=mouse;function mouse(e){set_scroll();y=(e)?e.pageY:event.y+sdown;x=(e)?e.pageX:event.x+sleft}function set_scroll(){if(typeof(self.pageYOffset)=="number"){sdown=self.pageYOffset;sleft=self.pageXOffset}else if(document.body.scrollTop||document.body.scrollLeft){sdown=document.body.scrollTop;sleft=document.body.scrollLeft}else if(document.documentElement&&(document.documentElement.scrollTop||document.documentElement.scrollLeft)){sleft=document.documentElement.scrollLeft;sdown=document.documentElement.scrollTop}else{sdown=0;sleft=0}}window.onresize=set_width;function set_width(){if(typeof(self.innerWidth)=="number"){swide=self.innerWidth;shigh=self.innerHeight}else if(document.documentElement&&document.documentElement.clientWidth){swide=document.documentElement.clientWidth;shigh=document.documentElement.clientHeight}else if(document.body.clientWidth){swide=document.body.clientWidth;shigh=document.body.clientHeight}}function createDiv(height,width){var div=document.createElement("div");div.style.position="absolute";div.style.height=height+"px";div.style.width=width+"px";div.style.overflow="hidden";div.style.backgroundColor=colour;return(div)}</script>
  3. Мигающая гирлянда:
    <script language=javascript type=text/javascript>//<![CDATA[
    function  COT(e,t,n,r){document.write('<div  id="cot_tl_fixed">');document.write("<><img src="+e+' alt="Новогодние украшения (скрипты) для сайта"  border="0"></a>');document.write("</div>")}var  Ovr2="";if(typeof  document.compatMode!="undefined"&&document.compatMode!="BackCompat"){cot_t1_DOCtp="_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft   + document.documentElement.clientWidth -  offsetWidth);}"}else{cot_t1_DOCtp="_top:expression(document.body.scrollTop+document.body.clientHeight-this.clientHeight);_left:expression(document.body.scrollLeft   + document.body.clientWidth - offsetWidth);}"}if(typeof  document.compatMode!="undefined"&&document.compatMode!="BackCompat"){cot_t1_DOCtp2="_top:expression(document.documentElement.scrollTop-20+document.documentElement.clientHeight-this.clientHeight);}"}else{cot_t1_DOCtp2="_top:expression(document.body.scrollTop-20+document.body.clientHeight-this.clientHeight);}"}var  cot_tl_bodyCSS="* html {background: fixed;background-repeat:  repeat;background-position: left top;}";var  cot_tl_fixedCSS="#cot_tl_fixed{position:fixed;";var  cot_tl_fixedCSS=cot_tl_fixedCSS+"_position:absolute;";var  cot_tl_fixedCSS=cot_tl_fixedCSS+"top:0px;";var  cot_tl_fixedCSS=cot_tl_fixedCSS+"left:0px;";var  cot_tl_fixedCSS=cot_tl_fixedCSS+"clip:rect(0 100 85 0);";var  cot_tl_fixedCSS=cot_tl_fixedCSS+cot_t1_DOCtp;var  cot_tl_popCSS="#cot_tl_pop {background-color: transparent;";var  cot_tl_popCSS=cot_tl_popCSS+"position:fixed;";var  cot_tl_popCSS=cot_tl_popCSS+"_position:absolute;";var  cot_tl_popCSS=cot_tl_popCSS+"height:98px;";var  cot_tl_popCSS=cot_tl_popCSS+"width: 1920px;";var  cot_tl_popCSS=cot_tl_popCSS+"right: 120px;";var  cot_tl_popCSS=cot_tl_popCSS+"top: 20px;";var  cot_tl_popCSS=cot_tl_popCSS+"overflow: hidden;";var  cot_tl_popCSS=cot_tl_popCSS+"visibility: hidden;";var  cot_tl_popCSS=cot_tl_popCSS+"z-index: 99999;";var  cot_tl_popCSS=cot_tl_popCSS+cot_t1_DOCtp2;document.write('<style  type="text/css">'+cot_tl_bodyCSS+cot_tl_fixedCSS+cot_tl_popCSS+"</style>");COT("https://i.imgur.com/1sVQJsi.gif","SC2","none")//]]></script>
  4. Скрипт падающего снега:
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js'type='text/javascript'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.4.1/jquery-migrate.min.js'type='text/javascript'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/JQuery-Snowfall/1.7.4/snowfall.jquery.min.js'type='text/javascript'></script><script type='text/javascript'>jQuery(document).ready(function($){$(document).snowfall({flakeCount:400,flakeColor:"#ffffff",flakeIndex:999999,minSize:1,maxSize:4,minSpeed:2,maxSpeed:8,round:true,shadow:false,})});</script>
  5. Падающие красивые крупные снежинки
    <script type="text/javascript">var snowmax=35;var snowcolor=new Array("#AAAACC","#DDDDFF","#CCCCDD","#F3F3F3","#F0FFFF","#FFFFFF","#EFF5FF")var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS");var snowletter="*";var sinkspeed=0.6;var snowmaxsize=40;var snowminsize=8;var snowingzone=1;var snow=new Array();var marginbottom;var marginright;var timer;var i_snow=0;var x_mv=new Array();var crds=new Array();var lftrght=new Array();var browserinfos=navigator.userAgent;var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/);var ns6=document.getElementById&&!document.all;var opera=browserinfos.match(/Opera/);var browserok=ie5||ns6||opera;function randommaker(range){rand=Math.floor(range*Math.random());return rand}function initsnow(){if(ie5||opera){marginbottom=document.body.clientHeight;marginright=document.body.clientWidth}else if(ns6){marginbottom=window.innerHeight;marginright=window.innerWidth}var snowsizerange=snowmaxsize-snowminsize;for(i=0;i<=snowmax;i++){crds[i]=0;lftrght[i]=Math.random()*15;x_mv[i]=0.03+Math.random()/10;snow[i]=document.getElementById("s"+i);snow[i].style.fontFamily=snowtype[randommaker(snowtype/length)];snow[i].size=randommaker(snowsizerange)+snowminsize;snow[i].style.fontSize=snow[i].size+"px";snow[i].style.color=snowcolor[randommaker(snowcolor.length)];snow[i].sink=sinkspeed*snow[i].size/5;if(snowingzone==1){snow[i].posx=randommaker(marginright-snow[i].size)}if(snowingzone==2){snow[i].posx=randommaker(marginright/2-snow[i].size)}if(snowingzone==3){snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}if(snowingzone==4){snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size);snow[i].style.left=snow[i].posx+"px";snow[i].style.top=snow[i].posy+"px"}movesnow()}function movesnow(){for(i=0;i<=snowmax;i++){crds[i]+=x_mv[i];snow[i].posy+=snow[i].sink;snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+"px";snow[i].style.top=snow[i].posy+"px";if(snow[i].posy>=marginbottom-2*snow[i].size||parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){if(snowingzone==1){snow[i].posx=randommaker(marginright-snow[i].size)}if(snowingzone==2){snow[i].posx=randommaker(marginright/2-snow[i].size)}if(snowingzone==3){snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}if(snowingzone==4){snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}snow[i].posy=0}}var timer=setTimeout("movesnow()",50)}for(i=0;i<=snowmax;i++){document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"px;'>"+snowletter+"</span>")}if(browserok){window.onload=initsnow}</script>
  6. Снегопад
    <script type="text/javascript" src="http://www.skincorner.com/snow.js"> </script>
  7. Счетчик дней до Рождества (католического) в виде Санта Клауса
    <iframe frameborder="0" marginheight="0" marginwidth="0"
    scrolling="no" height="256" width="256"
    src="https://www.christmaswebmaster.com/countdowns/santacount.html">
    </iframe>
  8. Счетчик дней до нового года
    <script src="https://apps.elfsight.com/p/platform.js" defer></script> <div class="elfsight-app-88ad360f-1110-45bb-8772-e2cae52971b8"></div>
  9. Смотрите также виджет новогодних иконок социальных сетей
  10. Скрипт Гирлянда с музыкальными шариками. Скачать. В архиве подробное описание установки.

12 ответов к «Новогодние украшения (скрипты) для сайта в 2022 году»
  1. Я бы не стал пихать себе на сайт скрипты, расположенные на сторонних ресурсах.
    А если их изменят?
    Проще на время вставить содержание из js скрипта в тот же гаджет. Предварительно взглянув на содержание. Снег например норм. Разницы никакой, но так безопасней.
    Т.е. сделать как сделано в последнем примере. Только картинку загрузить к себе на сайт.

  2. Очень хорошо и интересно, а можно просьбу? Поделитесь пожалуйста скриптом искринок для курсора мышки, пожалуйста....)))

    1. Тимур, вот код искорок курсора:
      <div style="position:absolute; left:-5555px; top:-5555px;"> <script src="http://www.cursor-switch.com/widgets/2/2914803393.js&quot; type="text/javascript" charset="UTF-8"></script></div>

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *