Como hacer efectos copos de nieve

**Freddyto13** · 06/11/2009 16:18

Buenas como todos saben la navidad ya se acerca, y me gustaría darle a mi foro un toque navideño.

Eh visto en algunos foros un efecto de copos de nieves donde una lluvia de copos de nieve adornan la pagina y le dan ese toque a la navidad.

Quisiera saber si es un mod o como podría ponerle ese efecto en estos 2 meses para mi forito

Saludos

**Daniel B.** · 06/11/2009 16:49

Hola,

Hay muuuuchos métodos para hacer eso, frecuentemente con Javascript, insertar lo que deba ir antes de </head> en las plantillas del header precisamente, y lo que va en el <body>, en plantillas como Forumhome y demás.

Javascript - Efecto copos de nieve para todos los navegadores (cross browser) - Tutores.org)
scripts navideños - Foros del Web
Efecto Nieve (van cayendo copos de nieve) !!!! - Comunidades de foros - miarroba.com
Efecto Nieve con JavaScript
WebExperto.com - Efecto nieve - (Java Script)

Esos resultados salieron de una busqueda de Google que tenía como parametros de búsqueda "efecto nieve javascript" ... yo hace un año lo implementé en un foro vbulletin sin problemas... pero fui indiferente a la página que usé como referencia ya que como te dije, hay muchos métodos.

Ya si tienes un código y necesitas ayuda para insertarlo, puedes entonces decirnos

igual buscando Mods:
http://www.vbulletin.org/forum/showthread.php?t=197427
http://www.vbulletin.org/forum/showthread.php?t=99991
http://www.vbulletin.org/forum/showt...=197312&page=5
http://www.vbulletin.org/forum/showt...=132475&page=3
http://www.vbulletin.org/forum/showthread.php?t=85797

Es que estaba buscando en español y así no encontré nada, jeje....

Muevo el tema a <Soporte en General>

**Das Underground** · 06/11/2009 17:19

Si no me equivoco el hack que hace esos efectos, se llama season, busca con ese nombre...

**Freddyto13** · 06/11/2009 18:55

Gracias Daniel B. Me funciono perfecto men ya tengo nieve en mi web

habia puesto varios mod que conseguí en vbulletin.org pero todos salían pequeños :S uno de los que pusiste era justo lo que buscaba xd

**OLMID** · 08/11/2009 10:36

Hola Freddyto13

Me gustaría saber como lo has conseguido, he intentado poner un script en la plantilla header pero no encuentro la etiqueta </head> por ningún lado

Y si puedes, coloca aquí el script que has usado y donde lo has añadido

saludos y gracias

**Ricardo Núñez** · 08/11/2009 14:02

</head> es elk Header, Pon el codigo a principio de la plantilla Header.

**OLMID** · 09/11/2009 03:52

Hola de nuevo

Este es el script con las etiquetas html, podéis copiarlo a un bloc de notas y guardarlo como .html y lo abres con el navegador, funciona correctamente y se le pueden hacer los cambios que se deseen

Código:

<html>
<head>
</head>
<!--- EFECTO NIEVE --->
<script>

// Numero de copos, recomendados entre 30 y 40
var nieve_cantidad=35

// Colores de los copos se mostraran de forma aleatoria
var nieve_colorr=new Array("#aaaacc","#ddddFF","#ccccDD")

// Tipo de letra de los copos
var nieve_tipo=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

// Valor o letra de los copos
var nieve_letra="*"

// velocidad de caida
var nieve_velocidad=0.6

// tamaño mas grande de los copos
var nieve_cantidadsize=50

// tamaño mas pequeño de los copos
var nieve_chico=8

// 1 toda la pagina - 2 zona izquierda - 3 centro de pagina - 4 zona derecha
var nieve_zona=1

var nieve=new Array()
var marginbottom
var marginright
var timer
var i_nieve=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)
var browserok=ie5||ns6||opera

function aleatorio(range) {
rand=Math.floor(range*Math.random())
return rand
}

function initnieve() {
if (ie5 || opera) {
marginbottom = document.body.clientHeight
marginright = document.body.clientWidth
}
else if (ns6) {
marginbottom = window.innerHeight
marginright = window.innerWidth
}
var nievesizerange=nieve_cantidadsize-nieve_chico
for (i=0;i<=nieve_cantidad;i++) {
crds[i] = 0;
lftrght[i] = Math.random()*15;
x_mv[i] = 0.03 + Math.random()/10;
nieve[i]=document.getElementById("s"+i)
nieve[i].style.fontFamily=nieve_tipo[aleatorio(nieve_tipo.length)]
nieve[i].size=aleatorio(nievesizerange)+nieve_chico
nieve[i].style.fontSize=nieve[i].size
nieve[i].style.color=nieve_colorr[aleatorio(nieve_colorr.length)]
nieve[i].sink=nieve_velocidad*nieve[i].size/5
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=aleatorio(2*marginbottom-marginbottom-2*nieve[i].size)
nieve[i].style.left=nieve[i].posx
nieve[i].style.top=nieve[i].posy
}
movenieve()
}

function movenieve() {
for (i=0;i<=nieve_cantidad;i++) {
crds[i] += x_mv[i];
nieve[i].posy+=nieve[i].sink
nieve[i].style.left=nieve[i].posx+lftrght[i]*Math.sin(crds[i]);
nieve[i].style.top=nieve[i].posy

if (nieve[i].posy>=marginbottom-2*nieve[i].size || parseInt(nieve[i].style.left)>(marginright-3*lftrght[i])){
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=0
}
}
var timer=setTimeout("movenieve()",50)
}

for (i=0;i<=nieve_cantidad;i++) {
document.write("<span id='s"+i+"' style='position:absolute;top:-"+nieve_cantidadsize+"'>"+nieve_letra+"</span>")
}
if (browserok) {
window.onload=initnieve
}
</script>
<!--- /EFECTO NIEVE --->
<body bgcolor="#ddddee"></body>
</html>

Ya he colocado el script al principio de la plantilla Header y no hace nada
podéis orientarme como debo hacerlo? y si ese script es el adecuado?

saludos y gracias

**Daniel B.** · 10/11/2009 16:41

Iniciado por OLMID

Hola de nuevo

Este es el script con las etiquetas html, podéis copiarlo a un bloc de notas y guardarlo como .html y lo abres con el navegador, funciona correctamente y se le pueden hacer los cambios que se deseen

Código:

<html>
<head>
</head>
<!--- EFECTO NIEVE --->
<script>

// Numero de copos, recomendados entre 30 y 40
var nieve_cantidad=35

// Colores de los copos se mostraran de forma aleatoria
var nieve_colorr=new Array("#aaaacc","#ddddFF","#ccccDD")

// Tipo de letra de los copos
var nieve_tipo=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

// Valor o letra de los copos
var nieve_letra="*"

// velocidad de caida
var nieve_velocidad=0.6

// tamaño mas grande de los copos
var nieve_cantidadsize=50

// tamaño mas pequeño de los copos
var nieve_chico=8

// 1 toda la pagina - 2 zona izquierda - 3 centro de pagina - 4 zona derecha
var nieve_zona=1

var nieve=new Array()
var marginbottom
var marginright
var timer
var i_nieve=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)
var browserok=ie5||ns6||opera

function aleatorio(range) {
rand=Math.floor(range*Math.random())
return rand
}

function initnieve() {
if (ie5 || opera) {
marginbottom = document.body.clientHeight
marginright = document.body.clientWidth
}
else if (ns6) {
marginbottom = window.innerHeight
marginright = window.innerWidth
}
var nievesizerange=nieve_cantidadsize-nieve_chico
for (i=0;i<=nieve_cantidad;i++) {
crds[i] = 0;
lftrght[i] = Math.random()*15;
x_mv[i] = 0.03 + Math.random()/10;
nieve[i]=document.getElementById("s"+i)
nieve[i].style.fontFamily=nieve_tipo[aleatorio(nieve_tipo.length)]
nieve[i].size=aleatorio(nievesizerange)+nieve_chico
nieve[i].style.fontSize=nieve[i].size
nieve[i].style.color=nieve_colorr[aleatorio(nieve_colorr.length)]
nieve[i].sink=nieve_velocidad*nieve[i].size/5
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=aleatorio(2*marginbottom-marginbottom-2*nieve[i].size)
nieve[i].style.left=nieve[i].posx
nieve[i].style.top=nieve[i].posy
}
movenieve()
}

function movenieve() {
for (i=0;i<=nieve_cantidad;i++) {
crds[i] += x_mv[i];
nieve[i].posy+=nieve[i].sink
nieve[i].style.left=nieve[i].posx+lftrght[i]*Math.sin(crds[i]);
nieve[i].style.top=nieve[i].posy

if (nieve[i].posy>=marginbottom-2*nieve[i].size || parseInt(nieve[i].style.left)>(marginright-3*lftrght[i])){
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=0
}
}
var timer=setTimeout("movenieve()",50)
}

for (i=0;i<=nieve_cantidad;i++) {
document.write("<span id='s"+i+"' style='position:absolute;top:-"+nieve_cantidadsize+"'>"+nieve_letra+"</span>")
}
if (browserok) {
window.onload=initnieve
}
</script>
<!--- /EFECTO NIEVE --->
<body bgcolor="#ddddee"></body>
</html>

Ya he colocado el script al principio de la plantilla Header y no hace nada
podéis orientarme como debo hacerlo? y si ese script es el adecuado?

saludos y gracias

Allí tampoco está en el Header, usalo en otra plantilla como forumhome, este script no especifica que sea en el header.

**OLMID** · 11/11/2009 06:43

Bueno amigos, después de colocar el script en diferentes plantillas y distintos sitios, y viendo que no sucede nada, he decidido dejarlo por imposible

Quizás ese script no se puede poner, pero no se cual o como ponerlo, así que esperaré a ver si alguien postea alguno con un mini tutorial

saludos y gracias

**Daniel B.** · 12/11/2009 19:18

Teniendo los Mods de arriba, ¿ninguno te funciona?

**MUMRAH** · 01/12/2009 07:21

No entiendo tampoco donde vá
Saludos.

Lo hise en el FORUNHOME antes de la etiqueta <body> y no hace nada, como si no hubiera colocado nada, nos podrian dar una mejor ayuda? gracias

Bueno como que voy a tener que buscar soporte en otro lado porque sino me quedo sin nieve jejejeje, gracias de todas maneras por su ayuda.
Saludos.

**Lectro** · 01/12/2009 07:33

Probar a pegar el código en el Bloc de Notas, lo guardais con el nombre de snow.js y lo subiis al root de vuestro foro, después ir a: Estilos y Plantillas --> Buscar dentro de Plantillas --> headinclude

Buscar:

Código PHP:


<!-- / CSS Stylesheet -->

Debajo poner:

Código PHP:


<SCRIPT src="snow.js" type=text/javascript></SCRIPT>

Y le dais a guardar, decirme si os funcionó, pues de donde saqué esto no tienen el mismo código que habéis puesto arriba.

Créditos: Dureitor
(Downtwarez)

**Andrés Durán** · 01/12/2009 11:22

Iniciado por MUMRAH

No entiendo tampoco donde vá
Saludos.

Lo hise en el FORUNHOME antes de la etiqueta <body> y no hace nada, como si no hubiera colocado nada, nos podrian dar una mejor ayuda? gracias

Bueno como que voy a tener que buscar soporte en otro lado porque sino me quedo sin nieve jejejeje, gracias de todas maneras por su ayuda.
Saludos.

Buscando por snow en vBulletin.org, puedes ver varios temas en los que se habla del asunto. Un ejemplo es este add-on, que ya Daniel B. te había puesto un enlace en su mensaje:

Snow for your site :-) - vBulletin.org Forum

**MUMRAH** · 02/12/2009 08:06

Iniciado por Lectro

Probar a pegar el código en el Bloc de Notas, lo guardais con el nombre de snow.js y lo subiis al root de vuestro foro, después ir a: Estilos y Plantillas --> Buscar dentro de Plantillas --> headinclude

Buscar:

Código PHP:


<!-- / CSS Stylesheet -->

Debajo poner:

Código PHP:


<SCRIPT src="snow.js" type=text/javascript></SCRIPT>

Y le dais a guardar, decirme si os funcionó, pues de donde saqué esto no tienen el mismo código que habéis puesto arriba.

Créditos: Dureitor
(Downtwarez)

Gracias Lectro por el soporte y explicación que me has dado, se te agradece de verdad, pero ya encontré la solución por otro lado.

Iniciado por Chuta

Buscando por snow en vBulletin.org, puedes ver varios temas en los que se habla del asunto. Un ejemplo es este add-on, que ya Daniel B. te había puesto un enlace en su mensaje:

Snow for your site :-) - vBulletin.org Forum

Amigo Chuta, yo no dije que no veo los links, lo que pasa es que como novato que soy y que creo que habemos muchos usuarios así, no entendemos bien "Donde y Como" va colocado estos códigos, pero ya gracias a dios me dieron soporte.
Otra cosa amigo y con el respeto que te mereces, mi mensaje anterior lo editaste y en la razón para editar colocaste "Por fuentes groseras" quiero que sepas que en esta pagina no he visto fuentes groseras como las tengo yo en mi Photoshop y si te refieres a palabras groseras, es completamente falso ya que no soy ese tipo de personas.
Lo que falta allí, que tu editaste es "Y me disculpan que sea tan sincero pero es la realidad" y no creo que esa sea una frase grosera, el poder que te da la administración de ésta hermosa página no te dá el derecho de mal poner a los usuarios como lo hiciste conmigo colocando eso en "Razón para editar" en mi post, porque de esa manera los usuarios pensaran que de verdad dije alguna "Groseria" y no es asi.

Saludos amigos, gracias por todo y que tengan una feliz navidad

**Andrés Durán** · 02/12/2009 12:24

Cuando me refería a fuente grosera, no hablaba de que hayas puesto alguna grosería en tu mensaje, me refería a esto:

Ejemplo:

"Ayuda por favor"

Creo que todos podemos leer el tamaño de fuente predeterminado del foro no?

Por cierto, me alegro que lo hayas solucionado

Como hacer efectos copos de nieve

LinkBack

Herramientas

Califica este tema

Visualizar

Temas similares

[ayuda] como hacer que el sub foro se muestre como link Respuestas: 7

Efecto de nieve en mi foro... Respuestas: 7

Script que añade efectos en los nick... Respuestas: 4

Nieve en vbulletin Respuestas: 2

[SOLUCIOADO] como hacer para marcar temas como solucionado Respuestas: 6

Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Re: Como hacer efectos copos de nieve

Sobre vBHispano

Links

Patrocinadores