Faire tomber la neige sur votre site

Les récentes péripéties météorologiques m'ont conduite à ce script. Avec ces flocons qui tombent épais et serrés, on se croirait à Noël ! Alors, pourquoi ne pas faire tomber la neige en cette saison sur votre site ?... J'ai trouvé un script qui le permet. Son auteur est Scott Schiller. Ce script a en outre le bon goût de fonctionner avec plein de navigateurs, y compris ce vieux dinosaure d'Internet Explorer ;) 

Démonstration du résultat

De petits flocons de neige bleuâtres volettent ici ou là... Les mouvements de la souris orientent la direction du vent et modifient la trajectoire des flocons. Ils fondent quand ils atteignent le bas de l'écran :

L'effet est discret (cliquez pour agrandir)
L'effet est discret (cliquez pour agrandir)

Vous pouvez aussi voir une démonstration du résultat sur un fond foncé, en allant sur la page du développeur du script :

La neige tombe en blanc (cliquez pour agrandir)
La neige tombe en blanc (cliquez pour agrandir)
Flèche vers le haut

Installer le script dans Jimdo

Ce script est super facile à installer dans Jimdo !

Le code qui fait tomber la neige

Voici le code à copier-coller :

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

Où mettre le code fourni ?

En mode admin, rendez-vous dans la barre d'administration de votre site, cliquez sur Paramètres > Modifier le head et copiez-collez le code dans le cadre de saisie qui apparaît :

Pour valider vos changements, n'oubliez pas de cliquer sur le bouton 

Ajouter un bouton "Stop"

Pensez à vos visiteurs : cette neige, ça peut les agacer !... N'oubliez pas d'installer quelque part (par exemple dans la colonne latérale de votre site) un bouton qui permette de stopper l'effet. Ajoutez donc un Widget/HTML et collez ce code dans le cadre de saisie qui apparaît :

<a href="#" onclick="snowStorm.toggleSnow();return false" style=
"display: block; padding: 5px 10px; width: 120px; background: #efefef; border: 1px solid #ddd; color: #555; text-align: center; margin: auto;">Arrêter la neige</a>

Vous obtiendrez un bouton qui permet d'arrêter la neige et, au second clic, de la reprendre :

Flèche vers le haut

Paramétrer des options (facultatif)

Les plus courageux peuvent paramétrer certaines options du script, notamment choisir la couleur de la neige qui tombe, ajouter un effet de scintillement, etc. Ajoutez le code suivant sous le premier code que vous avez collé et modifiez-le en suivant les commentaires :

<script type="text/javascript">
//<![CDATA[

snowStorm.snowColor = '#49BDF8'; // Choisissez la couleur des flocons.
snowStorm.flakesMaxActive = 64; // Indiquez le nombre maximal de flocons qui tombent sur l'écran en même temps.
snowStorm.followMouse = false; // Le vent ne suit pas les mouvements de la souris : la neige tombe dans un seul sens.  Effacez la ligne pour éviter cet effet.
snowStorm.useTwinkleEffect = true; // La neige scintille. Effacez la ligne pour arrêter le scintillement.

//]]>
</script>

Let it snow, folks !

A vous la parole !

Écrire commentaire

Commentaires : 14
  • #1

    mathtice31 (jeudi, 04 avril 2013 02:30)

    Merci bcp c superb isa

  • #2

    Guy Kottelat (vendredi, 27 décembre 2013 21:35)

    Merci, merci

  • #3

    rizy (samedi, 21 juin 2014 17:11)

    vraiment thanks pour le tuto

  • #4

    meteo-drome-ardeche (lundi, 27 octobre 2014 15:38)

    Merci

  • #5

    aloeverasante (mardi, 02 décembre 2014 19:55)

    Génial !

  • #6

    cyber-a-douay-bouchain (jeudi, 11 décembre 2014 15:07)

    super, merci !

  • #7

    14RA010 (lundi, 22 décembre 2014 10:09)

    super merci

  • #8

    Pierrette Philibert (mardi, 24 novembre 2015 08:16)

    Merci beaucoup, c'est cette neige fine que je cherchait
    Pierrette

  • #9

    cricri (samedi, 28 novembre 2015 20:16)


    cela m'indique que le lien n'est pas valide que faire ?

  • #10

    Thierry pour Naucalaa2015 en Finistère (mardi, 15 décembre 2015 07:54)

    Just great ! Merci Braz

  • #11

    Bernard (jeudi, 17 décembre 2015 18:44)

    Bonjour , merci tout d'abord pour mettre votre savoir à la portée du plus grand nombre , puis auriez vous la gentillesse de bien vouloir m'indiquer un exemple de la formule flocons de neige en changeant la couleur , j'ai fait plusieurs essais infructueux jusqu'ici ...
    Merci encore ,.., Bernard

  • #12

    Alno (mercredi, 13 janvier 2016 20:23)

    Bonsoir,
    Help !!! j'ai utilisé votre code, magnifique résultat merci beaucoup. Mais gros problème je ne sais plus sur quel article du blog j'ai inséré ce code, pourriez vous m'aidez a le trouver et le supprimer jusque l'année prochaine bien sur !!!
    Amicalement
    GR22

  • #13

    Breiz22 (mardi, 19 janvier 2016 19:22)

    Bonjour,
    Super animation sur le blog, petit problème tout bien fait comme indiquer, sauf que je ne sais plus sur quel article j'ai inséré ce code(euphorie de fin d'année surement).
    Pourriez vous me donner la solution pour stopper cette animation sur le blog

    Amicalement

  • #14

    Isa (mardi, 19 janvier 2016 19:34)

    Bonjour,

    Vous avez inséré le code dans la colonne latérale de votre site, entre la vidéo GR22 et la photo légendée "Lou Anne 2015".

    Cordialement,

    Isabelle

Ruban