Faire tomber de la neige, coeurs, papillons ce que vous voulez sur votre blog

Publié le par mademoiselle-biotupp

Voici quelques petites astuces pour décorer votre blog

(scripts avec java script)

1) première méthode: faire tomber ce que vous voulez sur votre site
* dans un premier temps copiez un mini gift dans le fichier image de votre blog ou passer par un hébergeur gratuit

vous trouverez de mignons mini gift  i​ci (le site a été supprimé)
* copier le script  du blog demolituto (java script ) et coller le en mode source HTML de votre article ou en dans le module pied de page si vous vouler que le script fonctionne sur toutes les pages de votre site.

réédit : Demolito a déménagé son blog ...vous trouverez le script dans les commentaires sous cet article

*copier le lien de votre minigift
*coller ce lien à la place de " http://mon image.gif  " dans le script de demolituto 

c'est un peu long ....

2) pour faire tomber des petiter coeurs voici un script beaucoup plus court !

<script src="http://ddata.over-blog.com/xxxyyy/0/06/31/40/scripts/flocons/coeurs.js" type="text/javascript"></script>

3) pour faire tomber des flocons de neige (forme ronde) voici un autre script 

<script src="http://sd-1.archive-host.com/membres/up/37821634957680146/neige/snowstorm.js" type="text/javascript"> </script>
 

Avertissement

Ces 3 méthodes permettent d'avoir des images tombantes différentes à travers votre blog.
Vous pouvez les utiliser pour illustrer vos rubriques:
-fleurs      >>>  jardinage
-gâteaux   >>>  recettes de cuisine...


Je viens à l'inconvénient:
si on insère ce script sur un article le "phénomène" s'observe sur toute la page donc vous pouvez vous retrouvez avec plusieurs scripts sur la même page, si un jour vous décidez de mettre un script pour tout le blog.
Le nombre d'images tombantes va être multiplié par le nombre de script, ce qui peut nuire à la lisibilité du blog.

Pour me rappeler l'endroit où j'ai inséré le script je laisse en bas de l'article, l'image en point de repère car un blog évolue constemment!

Partager cet article

Commenter cet article

Miss Crochète 15/03/2016 22:37

Coucou
J'aime beaucoup ton blog plein d'astuces de toutes sortes.
Bravo !

line 12/01/2014 11:29

merci de ce partage

cnstrukid 31/05/2012 12:27

Merci beaucoup!

construkid 20/05/2012 15:36

Je n'est rien compris.
Pouvez vous me dire (en français svp) comment faire tombé des nuages?
merci

nessa 30/05/2012 18:01



ah désolée je n'avais pas vu votre commentaire, il faut copier ce script sur ce site 


http://demolitetuto.canalblog.com/archives/2007/05/30/5128460.html  


 


mais c'est vrai qu'il y a une redirection sur une autre page d'accueil maintenant.


Je mets le script de demolitetuto ici 


 


 


//Snow - http://www.btinternet.com/~kurt.grigg/javascript


if  ((document.getElementById) &&


window.addEventListener || window.attachEvent){


(function(){


//Configure here.


var num = 10;   //Nombre d'images


var timer = 200; //Vitesse de descente


var enableinNS6 = 1 //La vitesse varie selon les navigateurs. (1=yes, 0=no).


//Adresse des gifs ci-dessous


var url_gif = new Array();


url_gif[0]= "http://mon image.gif";


url_gif[1]= "http://mon image.gif";


url_gif[2]= "http://mon image.gif";


url_gif[3]= "http://mon image.gif";


nb_floc = 5; // Nombre de d'images différentes


//End.


var y = [];


var x = [];


var fall = [];


var theFlakes = [];


var sfs = [];


var step = [];


var currStep = [];


var h,w,r;


var d = document;


var pix = "px";


var domWw = (typeof window.innerWidth == "number");


var domSy = (typeof window.pageYOffset == "number");


var idx = d.getElementsByTagName('div').length;


if (d.documentElement.style &&


typeof d.documentElement.style.MozOpacity == "string")


num = 12;


for (i = 0; i < num; i++){


sfs[i] = 15; // Math.round(1 + Math.random() * 1);


document.write('');


// '+sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px;border:1px solid #dddddd;


currStep[i] = 0;


fall[i] = (sfs[i] == 1)?


Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);


step[i] = (sfs[i] == 1)?


0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;


}


if (domWw) r = window;


else{


  if (d.documentElement &&


  typeof d.documentElement.clientWidth == "number" &&


  d.documentElement.clientWidth != 0)


  r = d.documentElement;


else{


  if (d.body &&


  typeof d.body.clientWidth == "number")


  r = d.body;


}


}


function winsize(){


var oh,sy,ow,sx,rh,rw;


if (domWw){


  if (d.documentElement && d.defaultView &&


  typeof d.defaultView.scrollMaxY == "number"){


  oh = d.documentElement.offsetHeight;


  sy = d.defaultView.scrollMaxY;


  ow = d.documentElement.offsetWidth*0.80;


  sx = d.defaultView.scrollMaxX;


  rh = oh-sy;


  rw = ow-sx;


}


else{


  rh = r.innerHeight;


  rw = r.innerWidth*0.80;


}


h = rh - 2; 


w = rw - 2;


}


else{


h = r.clientHeight - 2;


w = r.clientWidth*0.80;


}


}


function scrl(yx){


var y,x;


if (domSy){


y = r.pageYOffset;


x = r.pageXOffset;


}


else{


y = r.scrollTop;


x = r.scrollLeft;


}


return (yx == 0)?y:x;


}


function snow(){


var dy,dx;


for (i = 0; i < num; i++){


dy = fall[i];


dx = fall[i] * Math.cos(currStep[i]);


y[i]+=dy;


x[i]+=dx;


if (x[i] >= w || y[i] >= h){


  y[i] = -10;


  x[i] = Math.round(Math.random() * w);


  fall[i] = (sfs[i] == 1)?


  Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);


  step[i] = (sfs[i] == 1)?


  0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;


}


theFlakes[i].top = y[i] + scrl(0) + pix;


theFlakes[i].left = x[i] + scrl(1) + pix;


currStep[i]+=step[i];


}


setTimeout(snow,timer);


}


function init(){


winsize();


for (i = 0; i < num; i++){


theFlakes[i] = document.getElementById("flake"+(idx+i)).style;


y[i] = Math.round(Math.random()*h);


x[i] = Math.round(Math.random()*w);


}


snow();


}


if (window.addEventListener){


window.addEventListener("resize",winsize,false);


window.addEventListener("load",init,false);





else if (window.attachEvent){


window.attachEvent("onresize",winsize);


window.attachEvent("onload",init);


}


})();


}//End.


 


 


tu remplaces les codes en rouge par l'url de ton image , c'est vrai que le html c'est pas trop du français lol



uguetta 21/12/2010 01:50



coucou


j'aimerais bien faire tomber de la neige sur mon blog mais je n'y comprends plus rien... ça fait un bail que j'ai pas fait ça.... merci du coup de main,


bises


hug



nessa 21/12/2010 10:15



je viens te répondre chez toi 



petitefolie72 13/01/2010 22:47


il y a un virus lorsque l on clique sur le script !!


Geneviève 21/10/2009 14:57


Erci de donner des "tuyaux". Je vis essayer de faire tomber une pluie de ??? je vais voir sur mon blog. Il y a longtemps que je cherche à faire cela.
Je continue ma visite
Bonne journée
Geneviève


myriam 26/08/2009 20:15

bonjours ton blog est génial...comment as tu fais pour avoir un fond fixe et que le milieu qui bouge ..j'ai cherchée mais je n'est pas trouver la solutions...sy tu ne veux pas me dire ton secret ..je ne t'envoudrais pas....car je croie que sane dois pas etre simple..mon blog est..blog de myriam.....

kitoune 04/05/2009 11:03

Oups je voulais essayer les papillons ! mais sans succès.Il faudrait que je relève ton lien, on ne peut pas faire de copier coller dommage.Merci Bonne journée

uguetta 22/04/2009 00:42

bravo pour les astuces, il est toujours bon de les avoir sous le coude...
alors bienvenue dans ma communauté des touche à tout !!!! à bientôt

miss28 15/04/2009 20:42

re à toi!!!
j'ai lus pour les gif qui tombe, j'y comprend rien comme pour le fond, c'est trop compliqué pour moi. Ca agacant qu'on on y arrive pas