Araña de Halloween para el blog

|

Ya falta poco para Halloween y para quienes quieran darle un poco de decoración al blog, vamos a ponerle una araña a la página que suba y baje a lo largo de la pantalla.
Puedes ver un ejemplo en este blog de pruebas.
Ustedes disculparán la calidad del dibujo pero soy un poco torpe con los programas de animación, así que hice todo lo que pude para darle animación a esta simpática araña.

Para ponerla en tu blog entra a Diseño > Edición de HTML y antes de </body> pega lo siguiente:
<img border='0' src='http://img101.imageshack.us/img101/9570/spiders.gif' style='position:fixed; top:0; left:0;'/>

La araña estará en el lado izquierdo, si quieres cambiarla a la derecha cambia donde dice left por right.
Debido a la mala calidad de la imagen, esta animación se ve mejor en fondos blancos o claros.

43 comentarios:

el venado dijo...

Jajaja simpatica araña.
Ya la puse.
y mañana se conocera al ganador del segundo sorrteo.
ojala ganara, pero no es tan facil.
Saludos

Jazmine Dguez. [bajo el pseudónimo de Lilith†La†Enemiga†d†Eva] dijo...

Potro: Me aceleré y puse la araña como gadget y ¡funcionó!... si quieres checarla, la tengo en mi nuevo blog [al que todos están cordialmente invitados a participar: http://lamansionencantada.blogspot.com/ así que los espero!] y, bueno... en dicho blog la araña encaja perfecto para hospedarse para siempre... ¡mil gracias!


Un beso,

unrealmat dijo...

Genual Animacion POTRO a diferencia de Jazime yo si lo ise tal como lo dices Gracias por el aporte pasate para que veas como quedo Gracias 1000 Sales Cuidate!
para quitarla supongo que borrare el codigo cierto? jeje sale Bie

El Potro dijo...

el venado, ya me habías desubicado en la fecha, jaja.

Jazmine Dguez. [bajo el pseudónimo de Lilith†La†Enemiga†d†Eva], quedó muy a tono con tu blog. P.D. Me gustó esa música =)

unrealmat, ese esqueleto te quedó genial ¿podrías compartirlo?

Eva, desconozco la plataforma WordPress, pero supongo que debe funcionar, ya que no es ningún script, sólo es manipulación de posición de una imagen. Saludos.

Mathias dijo...

Quedo muy bieen!!
gracias jejeje me encantas estos detalles segun la fecha :)

Emanuel Martinez dijo...

Muy Bueno Potro!!!Hace mucho que no pasaba!Quedo buenisima la araña,y estaria bueno que pase el esqueleto unrealmat!!

El Potro dijo...

Mathias, igual a mí me gusta poner un toque representativo de las fechas =)

Emanuel Martinez, qué bueno que te ha gustado; el lunes buscaré algunas animaciones para poder tener más opciones. Saludos.

fabian dijo...

jajajajaja que bien se ve la araña

PD:ojala nadie se asuste xD
saludos!

Emanuel Martinez dijo...

[quate]jajajajaja que bien se ve la araña

PD:ojala nadie se asuste xD
saludos![quate](lo ago a mi modo,xD)

Jajaja,es siertoo!!Mira si alguien despues te denuncia por haloween???xD

Manu dijo...

Jeje Potro mil gracias de nuevo, esta bien jevi esa ara~a, lol.

Turko dijo...

Muy apropiado y tan sencillo de aplicar.. :)

Saludos!

El Potro dijo...

fabian, podemos intentar poniendo mi foto para que se asusten, jaja.

Manu, ¿qué es jevi?... (?)

Turko, qué milagro verte de nuevo por acá, como siempre bienvenido =)

DE INTERES, me alegra que te haya gustado. Saludos.

@rielCastellanos dijo...

Hola Potro, te deseo mucho exitos en tus labores y al mismo tiempo quisiera saber si tendria usted la amabilidad de ayudarme, me estoy desvelando mucho con algo que no puedo hacer y se q tu podrias ayudarme por tus vastos conocimentos en el tema, para mi es algo muy complicado pero seguramente q para ti es pan comido, ok aki voy: Cambie la cabecera de mi BLOG por una IMAGEN, y kiero q la imagen (cabecera) tenga un enlace al mismo blog (inicio) pero no logro hacer eso solo esta la cabecera pero sin enlace, he invertido alrededor de 10 horas en 2 dias en eso (xq soy muy perseverante pero son las 3:13 am aki) pero ya no puedo mas, te agradeceria q me ayudaras por favor, mi blog es: http://blogunah.blogspot.com/ y mi email es arielgcb2007@gmail.com MIL GRACIAS El Potro, QUE DIOS TE BENDIGA.

Joel dijo...

lo intente pero quedaba mal mi fondo es negro xd pero modifique mi banner para la ocasion xd

fabian dijo...

Hola potro se que no tiene nada que ver xD pero me podrias pasar la direccion de tu favicon es que hace poco hice una faviconera y quiero añadir a ciudad blogger :)
saludos!

Manu dijo...

Potro jevi es como divertido, bien, creo k en tu pais le dicen chido a eso.

unrealmat dijo...

Para: EL POTRO
sin duda lo comparto esta es la direccion http://www.calacas.com.mx/animados/gifs/hangskeleton.gif

Para los demas si quieren poner el esqueleto agregenlo
como Gidget con el mismo codigo que el potro puso solo cambien la posision donde dice left por right. pero obiamente cambien la direccion donde esta alojada la arañita por el del esqueleto
lo explique bien EL POTRO?
jejeje no se explicar eres mejor tu el potro sale hay explicales Bien se ve rifado la calaquita verdad?
AQUI ENCONTRARAN MAS http://www.calacas.com.mx/animados/entrada.html

El Potro dijo...

Hola @rielCastellanos,

Bastante complicadas ese tipo de plantillas. El problema es que la imagen que pusiste de "cabecera" no es realmente la cabecera, sino el outer-wrapper, pero hiciste bien, ya que como cabecera no la acepta.
Lo que puedes hacer es poner una imagen transparente encima de la que ya tienes, y a esa aplicarle el enlace.
Entra en Diseño > Edición de HTML, marca la casilla Expandir artilugios y busca esta parte y agrega lo que está en negrita.
(Revisa línea por línea este código y si ves algo que no está en tu plantilla agrégalo también)

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='blogunah (cabecera)' type='Header'>
<b:includable id='title'>
<A expr:href='data:blog.homepageUrl'>
<img src='http://i34.tinypic.com/20pscbk.png'/>
</A>
</b:includable>
<b:includable id='description'>
<H2>
<data:description/>
</H2>
</b:includable>
<b:includable id='main'>

Como ves abarca casi todo el logotipo, excepto una parte pero te aseguro que nadie lo notará.
Saludos.

El Potro dijo...

Lo olvidaba, esta parte:

<H2>
<data:description/>
</H2>

Puedes quitarla, es la descripción del blog y tú ya la tienes en la imagen que has puesto, así que no te servirá.

El Potro dijo...

Joel, Mil disculpas con la imagen pero por más que quise trabajarla no pude hacer que se vea bien sobre fondos oscuros =(

fabian, muchas gracias por incluirme, esta es la URL del favicon:
http://dl.getdropbox.com/u/647003/favicon.GIF
Ya te agregué al mini directorio de faviconeras.
Saludos.

Manu, gracias por ampliar mi vocabulario =)

unrealmat, muchas gracias, a ver si mañana publico más imágenes incluyendo la calaquita. Saludos.

Alex dijo...

muy bien potro

eesta muy bien
esto lo he colocado en uno de mis blogs

espero por mas animaciones

gracias

Alex dijo...

Mira potro encontre un varios fantasmas
http://www.gifmania.com.pe/terror/fantasmas/Fantasma_04.gif
http://www.gif-animados.net/gifs2/tfantasma2.gif
http://www.mundomatero.com/imagenes/fantasma6.gif
una casa embrujada
http://www.yodibujo.es/_uploads/_tiny_galerie/200810/castillodracula_nmw.gif
un vampiro
http://www.sologif.net/Terror/Vampiros/vampiro-01.gif

DE INTERES dijo...

Hola, vengo a contarte que tu arañita a sido un exito en mi blog, les he dicho que es tuya y les he puesto el Blog. Nuevamente gracias, y saludos

www.bonaisima.com dijo...

si quieren la pueden poner en los dos lados ,solo tienen que repetir el script y ponerle a uno derecha y al otro izquierda right and left ,,para que se vea mejor todavia ,gracias potro

El Potro dijo...

Hola DE INTERES,

Me alegro que les haya gustado a tus lectores.
Saludos.

-Lunatika- dijo...

ah que bonita la araña la probe en el blog quedo perfecto n.n

gracias

unrealmat dijo...

EL PORTO espero con ancia los resultados del concurso :)
alrato regreso aver si ya esta Publicado

@rielCastellanos dijo...

Hola, solo queria agradecerte por tomarte el tiempo de resolver mi problema, mil gracias, es q el que sabe, SABE, te felicito, ya tengo el enlace en la cabecera de mi blog, MIL GRACIAS nuevamente, solo me queda una pequeña duda, como puedo hacer para que la imagen se pona mas a la izquierda y no en el centro como esta ahora? me gutaria que abarcara las letras completas de izquierda a derecha, el tamaño de la imagen transparente esta muy bien, solamente si pudiera estar desde la izquierda, de antemano gracias!

Datos: http://blogunah.blogspot.com/

Atte. @rielCastellanos

El Potro dijo...

Hola @rielCastellanos,

Busca esta parte de tu plantilla:

#header {
margin: 5px 5px 5px 170px;
text-align: left;
color:#000000;
}

Cambia el 170px por 5px, de ese modo la imagen transparente abarcará todas las letras del título.

Saludos!

@rielCastellanos dijo...

Hola de nuevo, nuevamente gracias, solucionaste por completo (100%) el problema que tenia, de veras, llevaba dandole vueltas muchas horas antes de preguntar pero es de esto no se mucho, pero valio la pena preguntarte, gracias.

Aqui una reflexion:

"Saber que se sabe lo que se sabe y que no se sabe lo que no se sabe; he aquí el verdadero saber." Confucio

El Potro dijo...

Definitivamente el que cree saberlo todo no sabe nada =)
Me alegro que se haya solucionado tu problema.
Saludos.

El Potro dijo...

Hola Zar,

Entra a Diseño > Edición de HTML y con las teclas CTRL + F busca esa etiqueta.
Saludos.

cyberbloggero dijo...

antes que nada... quiero felicitarte bro por los 41 comentarios!!!!!!!!!!! eres magnífico!!!!

Este truco lo vi por primera vez en poloiproducciones, el blog de Juli... y ahora veo que lo debe haber sacado de aquí..jajajajjaa...

Todos los dias veo blogs que tienen tus trucos!!! me imagino como debes sentirte... estas sembrando trucos por toda la WEB!!!!

Un abrazo!!!

El Potro dijo...

Si es la misma araña fea entonces sí la sacó de acá, jaja. Perdón pero es que esta araña me salió con unos bordes blancos espantosos; pero esa es la idea del Halloween, espantar! jaja.
Un abrazo!

Publicar un comentario en la entrada

Gracias por tus comentarios. Si tienes una consulta sobre tu blog deja la dirección del mismo.

 

Ciudad Blogger. Copyright 2008 All Rights Reserved Revolution Two Church theme by Brian Gardner Converted into Blogger Template by Bloganol dot com

Ir arriba Ir abajo