« Utilisateur:Pinocchio/snowfall.js » : différence entre les versions
De BoyWiki
Aucun résumé des modifications |
(m) |
||
Ligne 5 : | Ligne 5 : | ||
var snowfallscrh = 0; | var snowfallscrh = 0; | ||
var snowfallflakemax = 100; | var snowfallflakemax = 100; | ||
var snowfallgravity = | var snowfallgravity = 6; | ||
var snowfallwind = 5; | var snowfallwind = 5; | ||
var snowfallflakes = []; | var snowfallflakes = []; | ||
Ligne 44 : | Ligne 44 : | ||
var flake = document.createElement("div"); | var flake = document.createElement("div"); | ||
flake.className = 'flake'; | flake.className = 'flake'; | ||
flake.style.fontSize = snowfallgetrandom( | flake.style.fontSize = snowfallgetrandom(10,22) + 'px'; | ||
flake.style.top = snowfallgetrandom(0,snowfallscrh) + 'px'; | flake.style.top = snowfallgetrandom(0,snowfallscrh) + 'px'; | ||
flake.style.left = snowfallgetrandom(0,snowfallscrw) + 'px'; | flake.style.left = snowfallgetrandom(0,snowfallscrw) + 'px'; | ||
// •⚫✱❆⁕⋇✷✸✹✺⬢⬣⬬☁ | // •⚫✱❆⁕⋇✷✸✹✺⬢⬣⬬☁ | ||
flake.innerHTML = " | flake.innerHTML = "•"; | ||
var nf = document.getElementById("bodyContent").appendChild(flake); | var nf = document.getElementById("bodyContent").appendChild(flake); | ||
nf.speed = snowfallgetrandom(10,100); | nf.speed = snowfallgetrandom(10,100); |
Dernière version du 11 décembre 2014 à 16:25
// Snow effect
// Based on http://sutherlandboswell.com/2012/11/creating-pretty-snow-with-javascript-html-css
var snowfallscrw = 0;
var snowfallscrh = 0;
var snowfallflakemax = 100;
var snowfallgravity = 6;
var snowfallwind = 5;
var snowfallflakes = [];
function snowfallgetrandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
// flakes animation
function snowfallanimate() {
for (var i = 0; i < snowfallflakes.length; i++) {
newX = false;
newY = false;
// calculate Y position
newY = parseFloat(snowfallflakes[i].style.top) + (snowfallflakes[i].speed / 100) * snowfallgravity;
// if screen bottom reached
if (newY > snowfallscrh) {
newY = 0 - parseInt(snowfallflakes[i].style.fontSize);
newX = snowfallgetrandom(0,snowfallscrw);
}
// Calculate X position if it hasn't been set randomly
if (!newX) newX = parseFloat(snowfallflakes[i].style.left) + Math.sin(newY / snowfallwind);
if (newX < -20) newX = snowfallscrw + 20;
if (newX > snowfallscrw + 20) newX = -20;
// Set new position
snowfallflakes[i].style.top = newY + 'px';
snowfallflakes[i].style.left = newX + 'px';
}
}
// create flakes
function snowfallcreate() {
var nbflake = 0;
while (nbflake < snowfallflakemax) {
snowfallscrw = document.getElementById("bodyContent").clientWidth - 50;
snowfallscrh = document.getElementById("bodyContent").clientHeight;
var flake = document.createElement("div");
flake.className = 'flake';
flake.style.fontSize = snowfallgetrandom(10,22) + 'px';
flake.style.top = snowfallgetrandom(0,snowfallscrh) + 'px';
flake.style.left = snowfallgetrandom(0,snowfallscrw) + 'px';
// •⚫✱❆⁕⋇✷✸✹✺⬢⬣⬬☁
flake.innerHTML = "•";
var nf = document.getElementById("bodyContent").appendChild(flake);
nf.speed = snowfallgetrandom(10,100);
snowfallflakes.push(nf);
nbflake++;
}
setInterval(snowfallanimate, 40);
}
addOnloadHook(snowfallcreate);
window.onresize = function(event) {
snowfallscrw = document.getElementById("bodyContent").clientWidth - 50;
snowfallscrh = document.getElementById("bodyContent").clientHeight;
}