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 792 fois - Téléchargée 2 919 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
frogline Messages postés 15 Date d'inscription lundi 23 janvier 2006 Statut Membre Dernière intervention 5 juillet 2014
23 déc. 2010 à 21:29
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!
cs_droopi68 Messages postés 2 Date d'inscription mercredi 8 février 2006 Statut Membre Dernière intervention 24 décembre 2008
24 déc. 2008 à 13:42
Si moi ça marche sur IE7 sans problème !
cs_oceane751 Messages postés 151 Date d'inscription jeudi 23 décembre 2004 Statut Membre Dernière intervention 20 décembre 2012
19 déc. 2008 à 12:01
marche pas sur ie7
cs_droopi68 Messages postés 2 Date d'inscription mercredi 8 février 2006 Statut Membre Dernière intervention 24 décembre 2008
15 déc. 2008 à 10:37
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)
NeoO56 Messages postés 1 Date d'inscription mardi 21 août 2007 Statut Membre Dernière intervention 3 décembre 2007
3 déc. 2007 à 19:06
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.