1. Accueil
  2. Javascript
  3. Sources Javascript
  4. Sources Effets
  5. Neige firefox/ie

Neige firefox/ie

Soyez le premier à donner votre avis sur cette source.

Vue 34 679 fois - Téléchargée 2 911 fois

Télécharger le projet
Commenter

Description

Une script pour faire tomber de la neige que j'ai adapté à Firefox et IE7.

Source / Exemple : 


// JavaScript Document
<!-- Script écrit par Altan. Visitez son site! -->
<!-- http://www.altan.hr/snow -->

<!-- Script utiliser à titre d'exemple -->
<!-- http://www.espace-webmaster.com -->

<!-- Script modifié par Wells pour Firefox 2 et IE 7 -->
<!-- http://www.septentrion-game.com -->

<!-- Begin
var no = 20; // nombre de flocon
var speed = 50; // Vitesse ou tombe les flocons
var snowflake1 = "http://www.septentrion-game.com/IMAGE/noel/floc.gif"; // Nom de votre image
var snowflake2 = "http://www.septentrion-game.com/IMAGE/noel/floc2.gif"; // Nom de votre image
var snowflake3 = "http://www.septentrion-game.com/IMAGE/noel/floc3.gif"; // Nom de votre image
var snowflake4 = "http://www.septentrion-game.com/IMAGE/noel/floc4.gif"; // Nom de votre image
var nb=4;

var ns4up = (document.layers) ? 1 : 0; // Version de netscape
var ie4up = (document.all) ? 1 : 0; // Version d' Internet Exploreur
var dx, xp, yp; // Coordonnées de positionnement
var am, stx, sty; // amplitude and step variables
var i, doc_width = 1024, doc_height = 768;
if (ns4up) 
  {
  doc_width = self.innerWidth;
  doc_height = self.innerHeight;
  } 
else if (ie4up) 
  {
  doc_width = document.body.clientWidth;
  doc_height = document.body.clientHeight;
  }
  
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
var i=0;

for (i = 0; i < no; ++ i) 
  {
  dx[i] = Math.floor(Math.random() * 1100)+20; // définition du coordonné
  if(dx[i]>doc_width-30) dx[i] = dx[i]-50;
  xp[i] = 5; // définition de la position
  am[i] = Math.random()*1;
  yp[i] = Math.random()*200-200;
  stx[i] = 0.02 + Math.random()/10; // set step variables
  sty[i] = 0.7 + Math.random(); // set step variables

  if (i == 0) 
    {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute;opacity:1;filter:alpha(opacity=100); Z-INDEX: 50; VISIBILITY: ");
    document.write("visible; TOP: 5px; LEFT: 15px;\"><img style='width:4px;' src=\"");
    var typefloc = Math.floor(Math.random() * nb)+1;
    if(typefloc==1) document.write(snowflake1 + "\" border=\"0\"></div>");
    if(typefloc==2) document.write(snowflake2 + "\" border=\"0\"></div>");
    if(typefloc==3) document.write(snowflake3 + "\" border=\"0\"></div>");
    if(typefloc==4) document.write(snowflake4 + "\" border=\"0\"></div>");
    } 
  else 
    {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute;opacity:1;filter:alpha(opacity=100); Z-INDEX: 50; VISIBILITY: ");
    document.write("visible; TOP: 5px; LEFT: 15px;\"><img style='width:4px;' src=\"");
    var typefloc = Math.floor(Math.random() * nb)+1;
    if(typefloc==1) document.write(snowflake1 + "\" border=\"0\"></div>");
    if(typefloc==2) document.write(snowflake2 + "\" border=\"0\"></div>");
    if(typefloc==3) document.write(snowflake3 + "\" border=\"0\"></div>");
    if(typefloc==4) document.write(snowflake4 + "\" border=\"0\"></div>");
    }
  }

function snowIE() 
  { // Définition de l'animation pour Internet Exploreur
  doc_width = document.body.clientWidth;
  doc_height = document.body.clientHeight;
  for (i = 0; i < no; ++ i) 
    {
    //deplacement vertical
    sty[i] = 0.2 + Math.random()*3;
    yp[i] += sty[i];
   
    //deplacement horizontal
    stx[i] = 0.08 + Math.random()/10;
    dx[i] += stx[i] + am[i]*Math.sin(dx[i]);
    
    test=Math.floor(Math.random()*1000);
    
    //tant que dans la page

    if (yp[i] < 600 && test>1) 
      {
      document.getElementById("dot"+i).style.top = Math.floor(yp[i])+"px";
      if (dx[i] < doc_width-5) document.getElementById("dot"+i).style.left = dx[i]+"px";
      }
    else //sinon on le remet en haut
      {
      yp[i]=0;
      dx[i] = 50 + Math.floor(Math.random() * 800)+5;
      }
    
    }
  setTimeout("snowIE()", speed);
  }
  
snowIE();

Conclusion :


Tout est paramétrable, une démo actuellement sur www.septentrion-game.com
Télécharger le projet

Codes Sources

A voir également

Ajouter un commentaire Commentaires
Signaler
Messages postés
15
Date d'inscription
lundi 23 janvier 2006
Statut
Membre
Dernière intervention
5 juillet 2014
bonjour, je suis complètement perdue!
je n'y connais RIEN en javascript, j'ai été parachutée administratrice d'un forum en phpBB2 et j'aimerais mettre de la neige sur mon écran.....

quelqu'un(e) peut-il m'aider en me détaillant la marche à suivre?
j'ai essayé de mettre le script ci-dessus en place avec toutes les indications et çe ne fonctionne pas!

merci d'avance!
Signaler
Messages postés
2
Date d'inscription
mercredi 8 février 2006
Statut
Membre
Dernière intervention
24 décembre 2008
Si moi ça marche sur IE7 sans problème !
Signaler
Messages postés
151
Date d'inscription
jeudi 23 décembre 2004
Statut
Membre
Dernière intervention
20 décembre 2012
marche pas sur ie7
Signaler
Messages postés
2
Date d'inscription
mercredi 8 février 2006
Statut
Membre
Dernière intervention
24 décembre 2008
Merci pour ce script sympa, et merci à FREMYCOMPANY de l'avoir modifié, pour ma part il fonctionne correctement sous IE et FF,

j'ai collé le script modifié par FREMYCOMPANY dans un fichier Noel.js à la racine de mon site.

Dans ce fichier au niveau des lignes suivantes...
var snowflake1 = "images/noel/floc.gif"; // Nom de votre image
var snowflake2 = "images/noel/floc2.gif"; // Nom de votre image
var snowflake3 = "images/noel/floc3.gif"; // Nom de votre image
var snowflake4 = "images/noel/floc4.gif"; // Nom de votre image
j'ai indiqué le chemin vers les images (pour ma part: images/noel/..), c'est là ou je l'es ai collé !

Ensuite dans ma page html, juste avant j'ai fais une insertion de la ligne suivante:
<script type="text/javascript" language="javascript" src="Noel.js"></script>

et c'est magique !! :o)

voilà j'espère que ces dernières indication pourrons être utiles à d'autres ;o)
Signaler
Messages postés
1
Date d'inscription
mardi 21 août 2007
Statut
Membre
Dernière intervention
3 décembre 2007
idem, sous IE7 ca ne marche pas, le script n'apparait meme pas dans la source de la page... je ne sais pas comment faire...
Afficher les 28 commentaires
S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.