Универсальный скрипт «падающий снег»

Скоро Новый год. Захотелось мне украсить свой сайт. Порылась в интернете в поисках универсального скрипта «падающего снега» для сайта, Хотелось найти простой код, без всяких заморочек. Чтобы не нужно было лезть в корень сайта, создавать дополнительные папки и т.д и т.п. Да и плагин использовать не хочется. Зачем нагружать сайт? Всегда лучше обходиться без плагина.

Код простой, совершенно не  нагружает сайт. Пришлось не много доработать скрипт «падающий снег» и ниже я прописала этот скрипт.

Вставьте этот скрипт перед закрывающим тегом </body>.

Вот этот простой код «падающего снега»:

 

<script type=»text/javascript»>
// Количество снежинок (не ставьте слишком много — может затормозить браузер)
var snowmax = 50;

// Разность скорости слоев (рекомендуется от 0.3 до 2)
var sinkspeed = 0.6;

// Максимальный размер снежинок (пиксели)
var snowmaxsize = 30;

// Минимальный размер снежинок (пиксели)
var snowminsize = 10;

// Скорость падения снега (мс)
var snowspeed = 20;

// Зона снегопада
// 1 — снегопад на всем пространстве
// 2 — снегопад в левой части
// 3 — снегопад по центру
// 4 — снегопад в правой части
var snowingzone = 1;

var i = 0;
grphcs = new Array();

// Список ссылок к картинкам снежинок

grphcs[i++] = «http://takvse.ru/wp-content/uploads/2016/11/snow1.gif»;
grphcs[i++] = «http://takvse.ru/wp-content/uploads/2016/11/snow2.gif»;
grphcs[i++] = «http://takvse.ru/wp-content/uploads/2016/11/snow3.gif»;
grphcs[i++] = «http://takvse.ru/wp-content/uploads/2016/11/snow4.gif»;

// Не редактировать ничего ниже этой линии
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 randoms(min, max){
return Math.floor(Math.random() * (max — min + 1)) + min;
};

function preloadimages(img){
image = new Image();
for(var i = 0; i < img.length; i++) image.src = img[i];
}

function initsnow() {
if (ie5 || opera) {
marginbottom = document.body.scrollHeight;
marginright = document.body.clientWidth — 15;
}
else if (ns6) {
marginbottom = document.body.scrollHeight;
marginright = window.innerWidth — 15;
}
var snowsizerange = snowmaxsize — snowminsize;
for (var 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].size = randommaker(snowsizerange) + snowminsize;
snow[i].style.width = snow[i].size + ‘px’;
snow[i].style.height = snow[i].size + ‘px’;
snow[i].style.zIndex = 1000;
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 (var 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()», snowspeed)
}

preloadimages(grphcs);

for(var i = 0; i <= snowmax; i++){
imgsrc = grphcs[randoms(0,grphcs.length-1)];
document.write(«<img src='» + imgsrc + «‘ id=’s» + i + «‘ style=’position:absolute;top:-» + snowmaxsize + «‘>»);
}
if(browserok){
window.onload = initsnow;

}

</script>

Как видите в  коде можно прописать свои настройки, а можно оставить и так.  Путь к изображению снежинок пропишите свой, или оставьте так, как есть

Подпишись на обновления takvse.ru !

1 response to "Универсальный скрипт «падающий снег»"

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

Яндекс.Метрика