10 efectos de nieve en jQuery para Navidad

En este artículo te proporcionaremos los mejores librerías y tutoriales para crear efectos de nieve con jQuery a través de unos sencillos ejemplos. La actual demanda de la animación con jQuery da pie a que los desarrolladores puedan hacer buenos efectos de animación gracias a esta librería Javascript. La navidad se acerca y qué mejor manera que celebrarla junto a nuestros usuarios aludiendo a su espíritu navideño. Una buena idea para acercarnos a nuestra comunidad de visitantes es compartir la navidad junto a ellos, y un gran método para ello es hacer que nieve durante unos días en nuestra página web. Por supuesto, esto es posible gracias a las animaciones en jQuery, y en este artículo te vamos a mostrar algunas librerías para llevarlo a cabo.

jQuery Snow Falling Plugin

La idea detrás de jQuery Snow Falling Plugin es crear un copo de nieve inicialmente, clonar ese copo de nieve en un cierto intervalo de tiempo y añadir valores aleatorios para las propiedades de cada uno de ellos. Y todo esto que te he contado ocupa menos de 1kb comprimido.

jSnow - jQuery Snow Effect

Añadir una animación que simule el efecto de la caída de la nieve con JavaScript es una manera rápida y fácil de mantener tu sitio web actualizado durante los días de navidad. Esto, sin duda alguna será valorado por los usuarios de tu web. jSnow, es un plugin de jQuery que hace exactamente eso, añade el efecto de la caída de la nieve a tu página web. jSnow es ligero (2 kb), no requiere archivos externos para funcionar (CSS o imágenes) y es muy fácil de utilizar.

jQuery Snowfall 1.5

jQuery Snowfall tiene una característica que lo hace diferente a los demás, es capaz de acumular nieve en algunos elementos. Es decir, en algunos componentes de tu página web, cuando la nieve caiga, se quedará acumulada en la parte superior, como ocurre en los tejados de las casas. Para ello, a la hora de declarar el estilo que vas a utilizar en el plugin, tendrás que pasarle el nombre de los elementos que servirán como colectores de nieve. Utiliza la etiqueta canvas para que la nieve se acumule en IE8 o inferior.

Snowstorm

Snowstorm provoca un efecto de nieve recién caída en JavaScript que puede ser fácilmente añadido a tus proyectos web. Su uso es totalmente gratuito, y es muy fácil de configurar. Un único archivo JavaScript nos proporcionará la funcionalidad que deseamos. No se necesitan imágenes para ejecutar el efecto de la nieve. Al igual que en el plugin anterior, con Snowstorm la nieve también se puede acumular, pero esta vez solo en el inferior de la página.

Dynamic Snow Effect

Decora tu página web con este gran plugin llamado Dynamic Snow Effect que te brinda la oportunidad de mostrar el efecto de la nieve cayendo en tu web. Mira como se escurre suavemente hacia el inferior de la página, para más tarde desaparecer. La imagen que se utiliza se puede modificar, así que puedes aprovechar este script para hacer que lluevan otros elementos y transformarlo hacia un uso distinto.

DS Snow

DS Snow es otro plugin de jQuery que habilita la lluvia de nieve al igual que los demás que te hemos mostrado. Tiene una caída agil, aunque para mi gusto un poco violenta (la animación no está muy conseguida). Aún así puedes descargar el script gratuitamente para poder utilizarlo en tus proyectos personales y celebrar la navidad con tus usuarios.

jqsnow

Para este plugin sí que necesitaremos de una imagen para crear el copo de nieve. Característica que puede ser aprovechada para hacer que caigan otros elementos en la web. Es 100% configurable y podremos definir aspectos básicos como la imagen que queremos que se muestre al caer, la cantidad de copos que queremos ver en pantalla, el número de segundos en el que el copo desaparecerá o el z-index de cada una de las precipitaciones.

Beautiful Snow Falling

Te presentamos esta animación de caída de nieve desarrollada con HTML5, CSS3 y jQuery. Sorprende a tus amigos desarrolladores con esta felicitación de Navidad implementado con las últimas tecnologías utilizadas en diseño web, en lugar de la vieja animación Flash. Puede descargar este felicitación navideña de forma gratuita.

Xmass Snow Globes Animation

Xmass Snow Globes Animation utiliza dos efectos de animación, un efecto de nieve 3D que se ejecuta utilizando el three.js 3d engine y un efecto Firefly jQuery. Las imágenes se rotan gracias a un carrusel jQuery. Elegí este carrusel, porque es un carrusel con bucle infinito y cuenta con opción para saltar. Cuando hablo de saltar, quiero decir que puede ir a un punto específico del carrusel cuando sea necesario.

Javascript HTML5 Canvas Snow in 3D

Con un efecto 3D realmente conseguido, Javascript HTML5 Canvas Snow in 3D es la animación que más me ha gustado de todas las que te he mostrado anteriormente. La ilusión óptica parece que traspasa la pantalla y que está nevando en nuestro propio equipo. Simplemente, sin palabras.

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP