Hey ihr Lieben, heute gibt es mal ein ganz weihnachtliches Tutorial. Schnee ist eines der Dinge die ich am Winter liebe und wie es auch auf eurem Blog weiße Weihnachten gibt, erkläre ich hier.
Zuerst müsst ihr bei Layout ein neues Gadget erstellen. Also Layout > Gadget hinzufügen > HTML/JavaScript
Dort fügt ihr dann folgenden Code ein
<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js" />
Wer das ganze noch etwas personaliesieren oder anpassen will, schließlich sieht man weiße Flocken auf weißem Hintergrund zum Beispiel nicht, kann dies natürlich tun und fügt stattdessen den folgenden Code, nachdem er geändert wurde, hinzu.
<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js" />
So und jetz kommen wir zu dem individuellen Teil
<script type="text/javascript">
snowStorm.snowColor = '#99ccff'; <- Hier könnt ihr jede Farbe eingeben
snowStorm.flakesMaxActive = 96; <-Immer noch nicht genug Schnee?!
snowStorm.useTwinkleEffect = true; Der Schnee flackert bzw. wird in und aus geblendet
Und wem der weiße Flöckchenschnee nicht gefällt, für den hab ich noch fallende Schneekristalle. Einfach folgenden Code einfügen:
<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>
Und wem der weiße Flöckchenschnee nicht gefällt, für den hab ich noch fallende Schneekristalle. Einfach folgenden Code einfügen:
<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>
