FORUM Tom's Hardware » Programmation » HTML / Javascript » modifier un effet de neige
 

modifier un effet de neige

Il y a 323 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici
Ajouter une réponse



 Mot :   Pseudo :  
 
Bas de page
Auteur
 Sujet : modifier un effet de neige
 
Plus d'informations

bjr,
 
j'aimerai associer une image au code ci-joint, à la place des flocons de neige.
possible ou pas ?
merci de votre aide
 
entre balises head
 
<!-- DEBUT DU SCRIPT -->
<style>
.drop { position: absolute; width: 3;  filter: flipV(), flipH(); font-size: 40; color: blue }
</style>
<script language="javascript">
snow = true;    // false-pluie;   true-neige
snowsym = " * "
rainsym = " ' "
intensite = 1     //Intensité de la pluie ou neige !
if(snow){sym = snowsym; speed=5; angle=1; drops=intensite}
else{sym = rainsym; speed=5; drops=intensite; angle=6}
movex = -speed/angle; movey = speed; count = 0;
function precipitation(){
for(move = 0; move < drops; move++){
xx[move]+=movex;  yy[move]+=mv[move];
hmm = Math.round(Math.random()*1);
if(xx[move] < 0){xx[move] = maxx+10;}
if(yy[move] > maxy){yy[move] = 10;}
drop[move].left = xx[move]
drop[move].top = yy[move]+document.body.scrollTop;
}setTimeout('precipitation()','1')}
</script>
<!-- FIN DU SCRIPT -->
 
entre balise body
<!-- DEBUT DU SCRIPT -->
<script language="javascript">
if (document.all){
drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array()
ly = "document.all[\'"; st = "\'].style"
for(make = 0; make < drops; make++){
document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>');
drop[make] = eval(ly+'drop'+make+st);
maxx = document.body.clientWidth-40
maxy = document.body.clientHeight-40
xx[make] = Math.random()*maxx;
yy[make] = -100-Math.random()*maxy;
drop[make].left = xx[make]
drop[make].top = yy[make]
mv[make] = (Math.random()*5)+speed/4;
drop[make].fontSize = (Math.random()*10)+20;
if(snow){col = '#C0C0C0'}else{col = 'blue'}
drop[make].color = col;
}
window.onload=precipitation
}
</script>
<!-- FIN DU SCRIPT -->

Plus d'informations

abracadabra...
par contre il faudra sans doute virer le filter du .drop qui premièrement est une exclusivité IE et deuxièmemenent inversera ton image, ce que tu ne souhaite sans doute pas ...
 

Code :
  1. <html>
  2. <head>
  3. <style>
  4. .drop { position: absolute; width: 3;  filter: flipV(), flipH(); font-size: 40; color: blue }
  5. </style>
  6. <script language="javascript">
  7. snow = true;    // false-pluie;   true-neige
  8. snowsym = "snow1.gif"
  9. rainsym = "snow1.gif"
  10. intensite = 100 //Intensité de la pluie ou neige !
  11. if(snow){sym = snowsym; speed=5; angle=1; drops=intensite}
  12. else{sym = rainsym; speed=5; drops=intensite; angle=6}
  13. movex = -speed/angle; movey = speed; count = 0;
  14. function precipitation(){
  15. for(move = 0; move < drops; move++){
  16. xx[move]+=movex;  yy[move]+=mv[move];
  17. hmm = Math.round(Math.random()*1);
  18. if(xx[move] < 0){xx[move] = maxx+10;}
  19. if(yy[move] > maxy){yy[move] = 10;}
  20. drop[move].left = xx[move]
  21. drop[move].top = yy[move]+document.body.scrollTop;
  22. }setTimeout('precipitation()','1')}
  23. </script>
  24. <!-- FIN DU SCRIPT -->
  25. </head>
  26. <body style='overflow:hidden;'>
  27. <script language="javascript">
  28. if (document.all){
  29. drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array()
  30. ly = "document.all[\'"; st = "\'].style"
  31. for(make = 0; make < drops; make++){
  32. document.write('<div id="drop'+make+'" class=drop><img src="'+sym+'" /></div>');
  33. drop[make] = eval(ly+'drop'+make+st);
  34. maxx = document.body.clientWidth-40
  35. maxy = document.body.clientHeight-40
  36. xx[make] = Math.random()*maxx;
  37. yy[make] = -100-Math.random()*maxy;
  38. drop[make].left = xx[make]
  39. drop[make].top = yy[make]
  40. mv[make] = (Math.random()*5)+speed/4;
  41. drop[make].fontSize = (Math.random()*10)+20;
  42. if(snow){col = '#C0C0C0'}else{col = 'blue'}
  43. drop[make].color = col;
  44. }
  45. window.onload=precipitation
  46. }
  47. </script>
  48. </body>

Plus d'informations

merci pour tous
par ailleur, en insérant l'image suivant http://archi57.free.fr/image_ping_7.gif
j'obtiens une sroll bar en bas quand l'image arrive sur le cote gauche de l'écran !!
comment l'enlever ?

Plus d'informations

même avec ça ???  

Code :
  1. <body style='overflow:hidden;'>

Profil : Pointeur
Plus d'informations

change maxx et maxy (lignes 34-35) ;)


---------------
Da Bidz Triad©®™: Bidz Interceptor
.:: Smileyz version 4.2 [050625]::. -- Code source disponible sous licence GPL.
[u
Plus d'informations

par quel valeur?

Profil : Pointeur
Plus d'informations

les largeur/hauteur approximative de l'image ;)


---------------
Da Bidz Triad©®™: Bidz Interceptor
.:: Smileyz version 4.2 [050625]::. -- Code source disponible sous licence GPL.
[u
Plus d'informations

aussi par exemple:

Code :
  1. maxx = document.body.clientWidth-document.images[0].offsetWidth-40;
  2. maxy = document.body.clientHeight-document.images[0].offsetHeight-40;

Plus d'informations

encore une chose, je n'arrive pas a maitriser l'angle de défilement de l'image, c'est instable
comment faire?


Message édité par archi57 le 14-01-2005 à 16:26:51
Plus d'informations

??? instable que veux tu dire ???

Plus d'informations

tu voudrais que toutes les images défilent suivant le mêm angle ???
c'est un effet volontaire de faire varier l'angle ...

Plus d'informations

exactement avoir le meme angle pour toutes les images


Message édité par archi57 le 14-01-2005 à 16:49:18
Plus d'informations

par exemple:
mv[make] = 1

Plus d'informations

le tout est de faire varier moins brutalement mv[make] ...

Plus d'informations

merci c ça
par ailleur, sur une autre page web (ci-joint)j'ai essayé d'insérer un sroll bar vertical dans un tableau, mais celui disparait quand ce tableau est acheminé par publication avec excel
comment faire pour que cette sroll bar reste apparente?
http://archi57.free.fr/Document2.htm


Message édité par archi57 le 14-01-2005 à 17:16:57
Plus d'informations

acheminé par publication avec excel ???
excel ne gere nin javascript ni html ???

Plus d'informations

biensur, quand tu crée un tableau sous excel, tu l'enregistre en tant que page web, et ensuite tu le publie dans un page html de ton choix

Plus d'informations

ouaip mais t'a déja regardé le code que te retourne excel pour faire une page web .... !!!!tu as 70% de ta page en css, 20% en javascript douteux!!! et 5 % de HTML le reste c'est du pur jus microsoft incompréhensible !!!
 
tu aurasplus vite fait de refaire tes tableaux avec notpad que d'essayer de trouver d'ou ça vient !

Plus d'informations

est si je mets un autre tableau en sous-couche ?

Plus d'informations

en sous couche ?
 
mets le tableau qui doit scroller dans un div de hauteur fixe avec overflow:auto ...

Plus d'informations

tu peux me faire un exemple avec le document2
voici mon email: archi57@free.fr

Plus d'informations

dernière question: je trouve que les images mettent un temps fou a apparaitre à l'écran ?


Aller à :