Utilisateur:Pinocchio/snowfall.js - Historique des versions

Pinocchio : m

2014-12-11T16:25:08Z

← Version précédente		Version du 11 décembre 2014 à 16:25
Ligne 5 :		Ligne 5 :
	var snowfallscrh = 0;		var snowfallscrh = 0;
	var snowfallflakemax = 100;		var snowfallflakemax = 100;
	var snowfallgravity = 4;		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(8,28) + 'px';		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);

Pinocchio le 10 décembre 2014 à 15:51

2014-12-10T15:51:21Z

← Version précédente		Version du 10 décembre 2014 à 15:51
Ligne 48 :		Ligne 48 :
	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);

Pinocchio : m

2014-12-10T14:49:57Z

← Version précédente		Version du 10 décembre 2014 à 14:49
Ligne 44 :		Ligne 44 :
	var flake = document.createElement("div");		var flake = document.createElement("div");
	flake.className = 'flake';		flake.className = 'flake';
	flake.style.fontSize = snowfallgetrandom(10,36) + 'px';		flake.style.fontSize = snowfallgetrandom(8,28) + '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);

Pinocchio le 9 décembre 2014 à 14:55

2014-12-09T14:55:18Z

← Version précédente		Version du 9 décembre 2014 à 14:55
Ligne 48 :		Ligne 48 :
	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);

Pinocchio le 9 décembre 2014 à 14:51

2014-12-09T14:51:31Z

← Version précédente		Version du 9 décembre 2014 à 14:51
Ligne 4 :		Ligne 4 :
	var snowfallscrw = 0;		var snowfallscrw = 0;
	var snowfallscrh = 0;		var snowfallscrh = 0;
	var snowfallflakemax = ~~120~~;		var snowfallflakemax = 100;
	var snowfallgravity = 4;		var snowfallgravity = 4;
	var snowfallwind = 5;		var snowfallwind = 5;
Ligne 44 :		Ligne 44 :
	var flake = document.createElement("div");		var flake = document.createElement("div");
	flake.className = 'flake';		flake.className = 'flake';
	flake.style.fontSize = snowfallgetrandom(12,45) + 'px';		flake.style.fontSize = snowfallgetrandom(10,36) + '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);

Pinocchio le 9 décembre 2014 à 14:40

2014-12-09T14:40:46Z

← Version précédente		Version du 9 décembre 2014 à 14:40
Ligne 4 :		Ligne 4 :
	var snowfallscrw = 0;		var snowfallscrw = 0;
	var snowfallscrh = 0;		var snowfallscrh = 0;
	var snowfallflakemax = ~~200~~;		var snowfallflakemax = 120;
	var snowfallgravity = 4;		var snowfallgravity = 4;
	var snowfallwind = 5;		var snowfallwind = 5;
Ligne 48 :		Ligne 48 :
	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);
Ligne 55 :		Ligne 55 :
	}		}

	setInterval(snowfallanimate, 50);		setInterval(snowfallanimate, 40);
	}		}

Pinocchio le 9 décembre 2014 à 13:12

2014-12-09T13:12:51Z

← Version précédente		Version du 9 décembre 2014 à 13:12
Ligne 47 :		Ligne 47 :
	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 = "?";		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);

Pinocchio : test

2014-12-09T13:05:01Z

test

Nouvelle page

// Snow effect
// Based on http://sutherlandboswell.com/2012/11/creating-pretty-snow-with-javascript-html-css

var snowfallscrw = 0;
var snowfallscrh = 0;
var snowfallflakemax = 200;
var snowfallgravity = 4;
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(12,45) + 'px';
flake.style.top = snowfallgetrandom(0,snowfallscrh) + 'px';
flake.style.left = snowfallgetrandom(0,snowfallscrw) + 'px';
//flake.innerHTML = "•??";
flake.innerHTML = "?";
var nf = document.getElementById("bodyContent").appendChild(flake);
nf.speed = snowfallgetrandom(10,100);
snowfallflakes.push(nf);
nbflake++;
}

setInterval(snowfallanimate, 50);
}

addOnloadHook(snowfallcreate);

window.onresize = function(event) {
snowfallscrw = document.getElementById("bodyContent").clientWidth - 50;
snowfallscrh = document.getElementById("bodyContent").clientHeight;
}

Utilisateur:Pinocchio/snowfall.js - Historique des versions

Pinocchio : m

Pinocchio le 10 décembre 2014 à 15:51

Pinocchio : m

Pinocchio le 9 décembre 2014 à 14:55

Pinocchio le 9 décembre 2014 à 14:51

Pinocchio le 9 décembre 2014 à 14:40

Pinocchio le 9 décembre 2014 à 13:12

Pinocchio : test

Pinocchio : m

Pinocchio : m

Pinocchio : test