Script effet d'objects tombants

Pour intégrer ce script d'animation d'objets tombants dans une rubrique de votre site vous devrez saisir ou copier/coller les quelques lignes de code ci-dessous dans un champ script HTML que vous appellerez par exemple SNOW et ajouter ensuite le nom de champ %SNOW% dans un des paragraphes de votre rubrique :

<script src="https://www.lauyan.com/goodies/snow/snow.js?8" id="_x2"></script>
<script>
function onTOWebPageLoaded(){
  initSnow( 1, ["#b6d6f7","#90bfef","#2196f3"], 45, 0.6, 15, 40 );
}
</script>

<script src="https://www.lauyan.com/goodies/snow/snow.js?8" id="_x2"></script>
<script>
function onTOWebPageLoaded(){
  initSnow( 3, ["#ea8888","#f44336","#aa0000"], 60, 0.6, 15, 40 );
}
</script>

La ligne "initShow" du script ci-dessus contient différents paramètres que vous pouvez modifier à votre convenance selon le thème de votre site et vos goûts.

1er paramètre: le style des flocons.

Dans notre exemple ci-dessus la valeur est fixée à
1 = style étoiles ( * )
mais vous pouvez utiliser également les valeurs suivantes: 
0 = style flocons ( * )
2 = style flocons + étoiles
3 = style coeurs ( ❤ )

2ème parametre: la ou les couleurs des flocons

Dans notre exemple ["#b6d6f7","#90bfef","#2196f3"] est la liste des différentes couleurs possibles des flocons dans des tons bleutés (sélectionnées aléatoirement pour chaque flocons) et celle de 3 autres couleurs ["#ea8888","#f44336","#aa0000"] pour des tons rouges pour les coeurs.

3ème paramètre: le nombre maximum de flocons 

Dans notre exemple nous avons défini 45 flocons possible. Attention à ne pas mettre une valeur beaucoup trop importante: cela pourrait surcharger les écrans (notamment ceux de petites tailles comme les smartphones) mais également ralentir la navigation de certains de vos visiteurs (selon la puissance de leur ordinateur, tablette ou smartphone)

4ème paramètre: la rapidité de l'animation des flocons

Dans notre exemple la valeur a été fixée à 0.6 qui correspond à une valeur moyenne
( 0.1 = très lent / 0.5 = normal / 1 = assez rapide / autres valeurs > 1 = rapide )

5ème paramètre: la taille minimale des flocons

Dans notre exemple la valeur a été fixée à 15. Cette valeur doit être supérieure à 6 pour que les flocons ou étoiles puissent être un minimum visible et identifiable. 

6ème paramètre: la taille maximale des flocons 

Dans notre exemple la valeur a été fixée à 40. La taille maximale doit être supérieure ou égale à celle minimale.

Remarques sur les couleurs de flocons 

Notre précédent exemple utilise 3 couleurs (des nuances de bleu) mais

• vous pouvez n'indiquer qu'une seule couleur. Si tel est le cas il vous faudra malgré tout encadrer votre unique valeur par [" et "]
• il n'y a pas de limite au nombre de couleurs que vous pouvez définir. Si vous utilisez au moins 2 couleurs il vous faudra les séparer avec des virgules: ","
• si, contrairement à notre exemple, le fond de page de votre site n'est pas blanc mais de couleur foncée et que vous désirez utiliser un jeu de couleur très clair, alors vous pouvez utiliser celui défini par défaut pour avoir des flocons en blanc et gris très clair. Pour utiliser les couleurs par défaut il vous faudra remplacer la liste des couleurs [...] par la valeur: null

Pour placer l'animation des flocons de neige dans une seule rubrique de votre site, nous avons vu précédemment qu'il fallait ajouter le script dans un des paragraphes de votre rubrique. Mais si vous désirez que l'animation soit présente dans toutes les pages de votre site web alors, toujours depuis l'étape "Rubrique" et dans n'importe quelle rubrique de votre site, il vous suffit simplement d'éditer le texte d'une section du pied de page de votre site afin de placer le script à ce niveau.