Hallo ihr Lieben!
Seit einiger Zeit schneit es schon bei mir, ich finde es echt süß, wenn man auf meinen Blog klickt und es rieseln kleine Schneesterne über den Bildschirm. Da sbeste dabei ist, man friert nicht bei dem virtuellen Schnee :)
Da ich gefragt wurde, wie ich das gemacht habe gibt es hier eine kleine Anleitung:
Anleitung
Ihr kopiert einfach folgenden Text:
<script language="JavaScript">
// Author: Yurij Gera
// TODO: make @media print... work for Mozilla and Opera
var SnowCount = exAutoCalculate();
var SnowMinSize = 12; // Minimum Snow-Font Size [Pixel]
var SnowMaxSize = 28; // Maximum Snow-Font Size [Pixel]
var SnowMinYSpeed = 0.5; // Maximum Y Speed [Pixel/Frame]
var SnowMaxYSpeed = 2.5; // Maximum Y Speed [Pixel/Frame]
var SnowMinXSpeed = 0.05; // Minumum Radial Speed [Radian/Frame]
var SnowMaxXSpeed = 0.15; // Maximum Radial Speed [Radian/Frame]
var SnowMinXDelta = 10; // Minimum X Delta [Pixel]
var SnowMaxXDelta = 20; // Maximum X Delta [Pixel]
var SnowMoveDelay = 25; // Delay [Milliseconds]
var SnowColors = ['#BBBBBB', '#DDDDDD', '#FFFFFF', '#BBBBFF']; // Snow Colors [Array]
exSnowInit();
function exSnowInit() {
SnowMoveDelay = 25; // Delay [Milliseconds]
exAddEvent(window, 'load', exSnowStart);
exAddEvent(window, 'resize', exSnowRefresh);
document.createStyleSheet().cssText = "@media print {.exSnowClass { DISPLAY: none; }}"; // IE only
}
function exAutoCalculate() {
var start = new Date();
for (var i = 0; i < 50000; i++) {
Math.random();
}
var end = new Date();
var delta = end.valueOf() - start.valueOf();
var EstimatedSnowCount = Math.min(Math.floor(10000 / delta), 500);
if (navigator.userAgent.match(/Opera/)) EstimatedSnowCount *= 0.5; // Hot fix opera
return EstimatedSnowCount;
}
function exRandom(Min, Max, Natural) {
if (typeof Natural == 'undefined')
Natural = false;
if (Natural) {
return Math.floor(Min + (Max - Min + 0.999999) * Math.random());
}
else
return Min + (Max - Min) * Math.random();
}
function exSnowStart() {
Snow = new Array();
for (i = 0; i < SnowCount; i++) {
var e = document.createElement("span");
e.className = 'exSnowClass';
e.style.fontFamily = 'Times';
e.style.fontSize = (SnowMinSize + Math.floor((SnowMaxSize - SnowMinSize) * Math.random())) + 'px';
e.style.color = SnowColors[exRandom(0, SnowColors.length-1, true)];
e.style.cursor = 'default';
e.style.position = 'absolute';
e.onselectstart = function () { return false; };
var t = document.createTextNode("*");
e.appendChild(t);
Snow[i] = document.body.appendChild(e);
}
exSnowRefresh();
exSnowMove();
}
function exSnowRefresh() {
SnowBoxWidth = document.body.clientWidth;
SnowBoxHeight = document.body.clientHeight;
for (i = 0; i < Snow.length; i++) {
var e = Snow[i];
e.YSpeed = exRandom(SnowMinYSpeed, SnowMaxYSpeed);
e.XSpeed = exRandom(SnowMinXSpeed, SnowMaxXSpeed);
e.XMaxDelta = exRandom(SnowMinXDelta, SnowMaxXDelta);
e.XDelta = Math.PI * Math.random(); // Stored Radial Delta (Radian)
e.X = exRandom(SnowMaxXDelta, SnowBoxWidth - SnowMaxXDelta - SnowMaxSize);
e.Y = exRandom(0, SnowBoxHeight - SnowMaxSize);
e.style.left = e.X + 'px';
e.style.top = e.Y + 'px';
}
}
function exSnowMove() {
for (i = 0; i < Snow.length; i++) {
with (Snow[i]) {
Y = (Y + YSpeed < SnowBoxHeight - SnowMaxSize) ? Y + YSpeed : 0;
XDelta += XSpeed;
style.left = X + Math.sin(XDelta) * XMaxDelta + 'px';
style.top = Y + 'px';
}
}
setTimeout("exSnowMove()", SnowMoveDelay);
}
function exAddEvent(o, e, f) {
if (typeof o.addEventListener != 'undefined')
o.addEventListener(e, f, false);
else if (typeof o.attachEvent != 'undefined')
o.attachEvent("on" + e, f);
else
return false;
return true;
}</script>
Nun öffnet ihr da Layout eures Blogs und fügt das Gedget "html/javascript" auf und kopiert den Text dort rein.
Ihr könnt im oberen Abschnitt die Größe und die Fallgeschwindigkeit eurer Schneeflocken noch so einstellen, bis sie euch richtig gut gefallen. Fertig!
Also, lasst es bei euch schneien :)
Liebe Grüße, easy
