HacÃa tiempo que hemos visto como muchas webs y blogs apuestan por hacer animaciones en sus páginas relacionadas con las fechas que vivimos. Navidades, Semana Santa, DÃas festivos, …. y un largo etcétera llaman la atención en muchos casos tanto como los famosos Google Doodle, que nacieron básicamente bajo esa idea.
En realidad lo que les vamos a dejar hoy es una forma sencilla de colocar nieve cayendo en su portada, es decir una animación que provoque el efecto de que está nevando en su blog, lo cual no deja de ser una tonterÃa, pero con esas tonterÃas la audiencia siempre está encantada. Y si es asà de simple colocar la nieve cayendo en tu web o blog como les vamos a contar a continuación ¿Por qué no hacerlo?
En todo caso, hay que modificar código, con lo que este artÃculo va para quienes ya han tocado el CSS o tienen ganas de aprender cómo hacerlo. Justo a continuación os dejamos con las secuencias que deben aparecer para que el lector vea el efecto de nieve cayendo. A mi la idea me ha encantado, asà que no me digan los que se dedican a ir un poco más allá del diseño ya preconfigurado que siempre me olvido de ustedes, que aunque sea por Navidad, esta vez hemos llegado.
/*Keyframes*/
@keyframes snow {
0% {background-position: 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
body {
background-color: #6b92b9;
background-image: url(‘snow.png’), url(‘snow3.png’), url(‘snow2.png’);
animation: snow 20s linear infinite;
}
Más info | @keyframes / Design Shack
