Bienvenido, invitado Ingresar o Registrarse
| | MARCADOR
| LENGUAJE:
 


marcador:
RSS 1.0     RSS 2.0

página:  1 | 2 | Siguiente >  último >>
Vistas Totales: 4935 - Respuestas Totales: 12

PUBLICADO POR: ChaKaL on 11/26/2013 21:53:53


ya que se acerca la navidad aqui les dejo un efecto de nieve cayendo para  poner en su perfil yo puse el efecto en las cabezeras  con la propiedad hover para que al pasar el cursor encima aparesca  la nieve cayendo pero ustedes pueden ponerla en cualquier parte de su pagina solamente cambiando el nombre del elemento que tengo en color rojo  y si quieren que se vea  constante sin nesesidad de que se vea al pasar el cursor solamente le quitan los dos puntos y la palabra hover  espero que les guste xaos xaos


donde dice (aqui va la url de tu imagen) es la imagen que quieren  que lleve de fondo pues las imagenes se cuentan de ultima a primera la ultima donde pones la imagen de fondo es la imagen que estara hasta el fondo y la de arriba encima y asi sucesivamente la primera url es la imagen que esta encima de las otras era solo una simple aclaracion si quieren que la nieve caiga en toda la pagina simplemente cambien las palabras en rojo .block_header:hover  por  la palabra  body




/* NIEVE CABEZERAS */


@keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}


@-moz-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


@-webkit-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}



@-ms-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


.block_header:hover {

background-image: url(http://lh3.googleusercontent.com/-k6mAvDmeu4Q/UMefU6JI32I/AAAAAAAADpM/zdjTclnGDhM/s500/snow.png), url(http://lh6.googleusercontent.com/-8wOkQAdxfgg/UMefVfmte0I/AAAAAAAADpU/aE4HxfiXD88/s400/snow3.png), url(http://lh5.googleusercontent.com/-fhO2tXwKP9M/UMefVCohCOI/AAAAAAAADpQ/nFVnzK1W0xw/s300/snow2.png),

url(AQUI VA LA URL DE TU IMAGEN DE FONDO);

-webkit-animation: snow 10s linear infinite;

-moz-animation: snow 10s linear infinite;

-ms-animation: snow 10s linear infinite;

animation: snow 10s linear infinite;

}


 pd: compuse el codigo porque se movia el fondo en mozilla y explorer y le aumente dos valores mas a los prefijos que corresponden a esos navegadores puse los valores  en cero que son los que se ven en rojo en el codigo esperemos ya no haya problemas saluditos 








PUBLICADO POR: Crucigrama on 11/27/2013 11:02:10


Veamos , ok ok .... si  si  ....   ajam !!!!, 

Okey si comprendo , quito aqui, pongo allá,  ajam !!!

Ohhh!!!!  Gusi eres lo maximo, gracias por tomarte el tiempo y enseñarnos, por cierto tu perfil y el de fulanita se ven espectaculares con el efecto 

Luego hay que quitar tanta nieve  jajajja

 Wiwi chu a merry crismas an japy niu yiar ♫





--------------------------------------------------------------
Volver Arriba




PUBLICADO POR: Crucigrama on 11/27/2013 20:43:49



Fulana_de_Nadie escribió:

SOS !!!

Mayday, Mayday, Mayday !!!

Socorro !!!

Help !!!

Mr. Chakal !!!  Me copia?



Plissssss  me to !!!!!!
Yo tambien necesito de ese Mayday!!!  MayDay!!!!!




--------------------------------------------------------------
Volver Arriba




PUBLICADO POR: ChaKaL on 11/27/2013 21:39:18



Fulana_de_Nadie escribió:

SOS !!!

Mayday, Mayday, Mayday !!!

Socorro !!!

Help !!!

Mr. Chakal !!!  Me copia?

Problemas en el frente !! Mi imagen de fondo no está estática, la veo en movimiento. Igualmente, he entrado a tu perfil y al de Cruci y las veo también en movimiento, en cambio el de Kapri sí lo veo estático.

Te agradezco por anticipado, la ayuda que puedas brindarme.

Aquí para que lo veas:





si niña ya lo vi no me habia dado cuenta gracias por avisar lo bueno que busque una manera de solucionarlo espero  ya todo este bien besos

Volver Arriba




PUBLICADO POR: ChaKaL on 11/27/2013 21:41:13



Crucigrama escribió:


Fulana_de_Nadie escribió:

SOS !!!

Mayday, Mayday, Mayday !!!

Socorro !!!

Help !!!

Mr. Chakal !!!  Me copia?



Plissssss  me to !!!!!!
Yo tambien necesito de ese Mayday!!!  MayDay!!!!!


cruci cruci  ya esta arreglado el codigo espero no me quieran linchar por mi error sorry 

Volver Arriba




PUBLICADO POR: Yara on 12/02/2013 07:16:00


Hola a todos en éste tópico, en especial a chakalin y mi paisana.

Bue, yo tengo una pequeña inquietud y quisiera saber, si éste efecto, que está muy lindo puede editarse, es decir, yo tengo varios codígos pero son en javascrip, y quisiera saber si a partir de éste código que tú has editado chakalin, puedo ponerle la animación de otro código, que vendría siendo uno de javascrip.


el código es éste:


Sparkle

Un beso chakalin, besitos paisana.





--------------------------------------------------------------
Volver Arriba




PUBLICADO POR: ChaKaL on 12/03/2013 22:02:20



Yara escribió:

Hola a todos en éste tópico, en especial a chakalin y mi paisana.

Bue, yo tengo una pequeña inquietud y quisiera saber, si éste efecto, que está muy lindo puede editarse, es decir, yo tengo varios codígos pero son en javascrip, y quisiera saber si a partir de éste código que tú has editado chakalin, puedo ponerle la animación de otro código, que vendría siendo uno de javascrip.


el código es éste:


Sparkle

Un beso chakalin, besitos paisana.


no entendi bien pero a que te refieres exactamente con editarlo con otro codigo de javascript?

te refieres a cambiarle las imagenes ?

Volver Arriba




PUBLICADO POR: Crucigrama on 01/09/2014 21:41:18


/* NIEVE CABEZERAS */


@keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}


@-moz-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


@-webkit-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}



@-ms-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


.block_header:hover {

background-image: url(Aquí la URL del efecto # 01), url(Aquí la URL del efecto #02), url(Aquí la URL del efecto #03),

url(AQUI VA LA URL DE TU IMAGEN DE FONDO);

-webkit-animation: snow 10s linear infinite;

-moz-animation: snow 10s linear infinite;

-ms-animation: snow 10s linear infinite;

animation: snow 10s linear infinite;

}


Como bien nos explico Chakal en el efecto nieve.... a este mismo le podemos realizar modificaciones y cambiar la nieve por  diferentes imágenes  de fondo transparente, yo estoy dejando algunas muestras,  si te fijas donde dice : Aquí la URL del efecto , tenemos la posibilidad de trabajar con 3 diferentes imágenes,  pero también con una  o con dos solamente, lo único que debes hacer el pegar el link de la imagen y sustituirlo por la frase que te indica donde debes colocar el URL, si solo trabajas  con una dejas los otros dos paréntesis sin ningún tipo de información, también puedes modificar los tiempos, las últimas 4 lineas del efecto donde dice : 10s, lo puedes cambiar  a  50s, por ejemplo, y así juegas un poco con lo que sería la presentacion del efecto.

 

Efecto con burbujas

http://oi41.tinypic.com/mvm1a8.jpg

Efecto con hojas amarillas

http://oi41.tinypic.com/16bhu75.jpg

Efecto con hojas dos colores

http://oi39.tinypic.com/wr055s.jpg

Efecto con burbujas azules

http://oi44.tinypic.com/rhlq21.jpg

Efecto con burbujas de colores

http://oi40.tinypic.com/2q9kmxc.jpg

Efecto con flores azules

http://oi43.tinypic.com/2zyc5qw.jpg

Efecto con flores blancas

http://oi40.tinypic.com/1ttveq.jpg

Efecto con margaritas

http://oi42.tinypic.com/2v14xsy.jpg

Efecto con flores amarillas

http://oi43.tinypic.com/2m5eys1.jpg

Efecto con flores amarillas  y  burbujas

http://oi40.tinypic.com/2mcask7.jpg

Efecto con pétalos 

http://oi41.tinypic.com/6xytxg.jpg

Efecto con pétalos  y  burbujas

http://oi40.tinypic.com/ix6t95.jpg

Efecto con flores rosadas

http://oi42.tinypic.com/2ee9e7n.jpg

Efecto con Calavera

http://oi40.tinypic.com/312hgn6.jpg

Efecto con Calavera - 2


http://oi43.tinypic.com/2q09b7m.jpg

Efecto con Corona

http://oi42.tinypic.com/1zqsjnr.jpg

Efecto con Cerveza

http://oi42.tinypic.com/2e0pmh1.jpg

Efecto con Tekila

http://oi40.tinypic.com/2wrf6hg.jpg

Efecto con Tekila - 2

http://oi41.tinypic.com/r0twt1.jpg

Efecto con Tekila - 3

http://oi39.tinypic.com/jl5nwp.jpg

Efecto con Calaverita negra

http://oi42.tinypic.com/2jaaflz.jpg

Efecto con Calaverita rosa

http://oi42.tinypic.com/35220e1.jpg


Efecto con Calaverita rosa - 2

http://oi44.tinypic.com/2rwqjxk.jpg

Efecto con Jacks Daniels

http://oi40.tinypic.com/312hgn6.jpg





--------------------------------------------------------------
Volver Arriba




PUBLICADO POR: ChaKaL on 01/19/2014 22:17:52


thanks por las imagenes cruci para todos los gustos  me gusto el de la cerveza con limon 

Volver Arriba




PUBLICADO POR: MiRoN73123 on 10/29/2015 09:24:11



Crucigrama escribió:

/* NIEVE CABEZERAS */


@keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}


@-moz-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


@-webkit-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}

}



@-ms-keyframes snow {

0% {background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;}

100% {background-position: 500px 1000px, 400px 400px, 300px 300px, 0px 0px;}

}


.block_header:hover {

background-image: url(Aquí la URL del efecto # 01), url(Aquí la URL del efecto #02), url(Aquí la URL del efecto #03),

url(AQUI VA LA URL DE TU IMAGEN DE FONDO);

-webkit-animation: snow 10s linear infinite;

-moz-animation: snow 10s linear infinite;

-ms-animation: snow 10s linear infinite;

animation: snow 10s linear infinite;

}


Como bien nos explico Chakal en el efecto nieve.... a este mismo le podemos realizar modificaciones y cambiar la nieve por  diferentes imágenes  de fondo transparente, yo estoy dejando algunas muestras,  si te fijas donde dice : Aquí la URL del efecto , tenemos la posibilidad de trabajar con 3 diferentes imágenes,  pero también con una  o con dos solamente, lo único que debes hacer el pegar el link de la imagen y sustituirlo por la frase que te indica donde debes colocar el URL, si solo trabajas  con una dejas los otros dos paréntesis sin ningún tipo de información, también puedes modificar los tiempos, las últimas 4 lineas del efecto donde dice : 10s, lo puedes cambiar  a  50s, por ejemplo, y así juegas un poco con lo que sería la presentacion del efecto.

 

Efecto con burbujas

http://oi41.tinypic.com/mvm1a8.jpg

Efecto con hojas amarillas

http://oi41.tinypic.com/16bhu75.jpg

Efecto con hojas dos colores

http://oi39.tinypic.com/wr055s.jpg

Efecto con burbujas azules

http://oi44.tinypic.com/rhlq21.jpg

Efecto con burbujas de colores

http://oi40.tinypic.com/2q9kmxc.jpg

Efecto con flores azules

http://oi43.tinypic.com/2zyc5qw.jpg

Efecto con flores blancas

http://oi40.tinypic.com/1ttveq.jpg

Efecto con margaritas

http://oi42.tinypic.com/2v14xsy.jpg

Efecto con flores amarillas

http://oi43.tinypic.com/2m5eys1.jpg

Efecto con flores amarillas  y  burbujas

http://oi40.tinypic.com/2mcask7.jpg

Efecto con pétalos 

http://oi41.tinypic.com/6xytxg.jpg

Efecto con pétalos  y  burbujas

http://oi40.tinypic.com/ix6t95.jpg

Efecto con flores rosadas

http://oi42.tinypic.com/2ee9e7n.jpg

Efecto con Calavera

http://oi40.tinypic.com/312hgn6.jpg

Efecto con Calavera - 2


http://oi43.tinypic.com/2q09b7m.jpg

Efecto con Corona

http://oi42.tinypic.com/1zqsjnr.jpg

Efecto con Cerveza

http://oi42.tinypic.com/2e0pmh1.jpg

Efecto con Tekila

http://oi40.tinypic.com/2wrf6hg.jpg

Efecto con Tekila - 2

http://oi41.tinypic.com/r0twt1.jpg

Efecto con Tekila - 3

http://oi39.tinypic.com/jl5nwp.jpg

Efecto con Calaverita negra

http://oi42.tinypic.com/2jaaflz.jpg

Efecto con Calaverita rosa

http://oi42.tinypic.com/35220e1.jpg


Efecto con Calaverita rosa - 2

http://oi44.tinypic.com/2rwqjxk.jpg

Efecto con Jacks Daniels

http://oi40.tinypic.com/312hgn6.jpg



donde dice aki la url del efecto no lo encuentro

Volver Arriba
12/13/2017
página:  1 | 2 | Siguiente >  último >>



*** Redplanetachat ***
redplanetachat