Ver Mensaje Individual
  #2 (permalink)  
Antiguo 18/12/2012, 07:08
Avatar de iblancasa
iblancasa
 
Fecha de Ingreso: diciembre-2012
Ubicación: España
Mensajes: 143
Antigüedad: 11 años, 5 meses
Puntos: 16
Respuesta: Crear efecto de nieve en web

El código no es ese realmente.
Tú, con el código que estás posteando, lo que estás haciendo es cargar un archivo Javascript que hace lo que quieres. El archivo es la dirección que hay después de "src". Al abrir, encontrarás ésto:
Código Javascript:
Ver original
  1. //Snow - http://www.btinternet.com/~kurt.grigg/javascript
  2.  
  3. if  ((document.getElementById) &&
  4. window.addEventListener || window.attachEvent){
  5.  
  6. (function(){
  7.  
  8. //Configure here.
  9.  
  10. var num = 30;   //Number of flakes
  11. var timer = 30; //setTimeout speed. Varies on different comps
  12. var enableinNS6 = 1 //Enable script in NS6/Mozilla? Snow animation could be slow in those browsers. (1=yes, 0=no).
  13.  
  14. //End.
  15.  
  16. var y = [];
  17. var x = [];
  18. var fall = [];
  19. var theFlakes = [];
  20. var sfs = [];
  21. var step = [];
  22. var currStep = [];
  23. var h,w,r;
  24. var d = document;
  25. var pix = "px";
  26. var domWw = (typeof window.innerWidth == "number");
  27. var domSy = (typeof window.pageYOffset == "number");
  28. var idx = d.getElementsByTagName('div').length;
  29.  
  30. if (d.documentElement.style &&
  31. typeof d.documentElement.style.MozOpacity == "string")
  32. num = 12;
  33.  
  34. for (i = 0; i < num; i++){
  35. sfs[i] = Math.round(1 + Math.random() * 1);
  36.  
  37. document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'
  38. +sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px"><\/div>');
  39.  
  40. currStep[i] = 0;
  41. fall[i] = (sfs[i] == 1)?
  42. Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
  43. step[i] = (sfs[i] == 1)?
  44. 0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
  45. }
  46.  
  47.  
  48. if (domWw) r = window;
  49. else{
  50.   if (d.documentElement &&
  51.   typeof d.documentElement.clientWidth == "number" &&
  52.   d.documentElement.clientWidth != 0)
  53.   r = d.documentElement;
  54.  else{
  55.   if (d.body &&
  56.   typeof d.body.clientWidth == "number")
  57.   r = d.body;
  58.  }
  59. }
  60.  
  61.  
  62. function winsize(){
  63. var oh,sy,ow,sx,rh,rw;
  64. if (domWw){
  65.   if (d.documentElement && d.defaultView &&
  66.   typeof d.defaultView.scrollMaxY == "number"){
  67.   oh = d.documentElement.offsetHeight;
  68.   sy = d.defaultView.scrollMaxY;
  69.   ow = d.documentElement.offsetWidth;
  70.   sx = d.defaultView.scrollMaxX;
  71.   rh = oh-sy;
  72.   rw = ow-sx;
  73.  }
  74.  else{
  75.   rh = r.innerHeight;
  76.   rw = r.innerWidth;
  77.  }
  78. h = rh - 2;  
  79. w = rw - 2;
  80. }
  81. else{
  82. h = r.clientHeight - 2;
  83. w = r.clientWidth - 2;
  84. }
  85. }
  86.  
  87.  
  88. function scrl(yx){
  89. var y,x;
  90. if (domSy){
  91.  y = r.pageYOffset;
  92.  x = r.pageXOffset;
  93.  }
  94. else{
  95.  y = r.scrollTop;
  96.  x = r.scrollLeft;
  97.  }
  98. return (yx == 0)?y:x;
  99. }
  100.  
  101.  
  102. function snow(){
  103. var dy,dx;
  104.  
  105. for (i = 0; i < num; i++){
  106.  dy = fall[i];
  107.  dx = fall[i] * Math.cos(currStep[i]);
  108.  
  109.  y[i]+=dy;
  110.  x[i]+=dx;
  111.  
  112.  if (x[i] >= w || y[i] >= h){
  113.   y[i] = -10;
  114.   x[i] = Math.round(Math.random() * w);
  115.   fall[i] = (sfs[i] == 1)?
  116.   Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
  117.   step[i] = (sfs[i] == 1)?
  118.   0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
  119.  }
  120.  
  121.  theFlakes[i].top = y[i] + scrl(0) + pix;
  122.  theFlakes[i].left = x[i] + scrl(1) + pix;
  123.  
  124.  currStep[i]+=step[i];
  125. }
  126. setTimeout(snow,timer);
  127. }
  128.  
  129.  
  130. function init(){
  131. winsize();
  132. for (i = 0; i < num; i++){
  133.  theFlakes[i] = document.getElementById("flake"+(idx+i)).style;
  134.  y[i] = Math.round(Math.random()*h);
  135.  x[i] = Math.round(Math.random()*w);
  136. }
  137. snow();
  138. }
  139.  
  140.  
  141. if (window.addEventListener){
  142.  window.addEventListener("resize",winsize,false);
  143.  window.addEventListener("load",init,false);
  144. }  
  145. else if (window.attachEvent){
  146.  window.attachEvent("onresize",winsize);
  147.  window.attachEvent("onload",init);
  148. }
  149.  
  150. })();
  151. }//End.

Si te vas a la línea que pone:
Código Javascript:
Ver original
  1. sfs[i] = Math.round(1 + Math.random() * 1);
Esa línea genera un número pseudoaleatorio y lo guarda. Ese será el tamaño de uno de los copos. Como está dentro de un bucle for, formará el tamaño de cada uno de los copos. La idea es generar copos de distintos tamaños. Si quieres que los copos sean más grandes, cambia el 1 por el número que quieras, tal que, si yo quisiera que tuvieran tamaño entre 0 y 100:
Código Javascript:
Ver original
  1. sfs[i] = Math.round(1 + Math.random() * 100);

Una vez cambiado el código, respetando los comentarios que tienen puestos los autores, lo guardas en un archivo ".js", lo subes en tu web, y lo enlazas tal que así:
<script src="miarchivo.js" type="text/javascript">
</script>

Un saludo.