Marquesina de imágenes que giran al pasar el mouse sobre ellas efecto 1 [100% mío]

¡Hola amores!
Estuve pensando hace varios días sobre crear una marquesina con algún efecto distinto o al menos encontrar algún código en la web pero como no encontré nada aquí está lo que conseguí.

Si se llevan el código y lo comparten, por favor den créditos.

Este es el efecto de una marquesina sin ningún efecto salvo el de la dirección del movimiento.



Muy bien, el efecto final sería este.

Empecemos.

Deben ir a Plantilla y ante la duda creen una copia de seguridad. Una vez hecho eso, van a Editor html y con Ctrl+f buscan: ]]></b:skin>

Para poder copiar los códigos, den click en view raw.
Antes de eso van a colocar lo siguiente:
Como aclaré en el código, pueden modificar el tiempo que tarda en rotar. En este caso dice que tarda 1 segundo.

360deg es lo que rota. 360 es la vuelta completa y 180 solo la mitad.

Una vez hecha las modificaciones a su gusto, vayan a vista previa y comprueben que todo esté correctamente. Si es así, den en guardar plantilla.
Luego van a Diseño y crean un nuevo gadget html/javascript. En la ventanilla pondrán esto:


Luego reemplazan como dice. Este código está hecho para quienes enlazan las imágenes a una entrada o link externo.
Para agregar más imágenes, antes de </marquee> pongan:


Pueden colocarlo cuantas veces deseen. Tengan cuidado cuando reemplazan.

¡Saludos!

  

10 comentarios:

  1. Hola Mar!
    No te das una idea de lo que te estoy amando por traer estw tutorial 💜
    Hace banda que quería aplicarlo al blog pero nadie me supo explicar cómo (soy un poco dura para los temas de html)
    Pero ahora entendí como se hace y mi felicidad es absoluta xD
    Un beso grande y millones de gracias por la entrada 😍

    ResponderEliminar
    Respuestas
    1. ¡Hola Juli! Sí, es algo que estuve buscando y no encontré así que lo hice yo xD

      Me alegro que te guste la entrada y que te pases por mi blog.

      ¡Saludos!

      Eliminar
  2. Holaaa! Adoro los tutoriales porque siempre quiero ir agregando detalles nuevos al diseño del blog. No tengo marquesina para las reseñas porque me da mucha pereza ir renovandolas a medida que agrego xD pero me encantó la idea de hacerlas girar. Muy original. Aunque por el momento paso de intentarlo jaja.
    Beso!

    ResponderEliminar
    Respuestas
    1. Te entiendo, a mi también me da pereza hacerlo jajajaja Pero me gusta que quede bonito y ordenado <3

      Besos <3

      Eliminar
  3. Hola!
    ¿Ya te dije que te tengo en favoritos, no? Me encantan estos tuturiales, son re útiles <3 Y me voy a plantear si ponerlo en mi plantilla, porque la idea que tenía era hacerlo fijo, pero ahora no sé...
    Por cierto, aceptas peticiones para temas? Porque hay varias cosas que me gustaría cambiar en mi blog y no tengo ni idea de cómo, jajaja.
    ¡Saludos!

    ResponderEliminar
    Respuestas
    1. ¡Hola! Gracias por tenerme en favoritos ^-^

      ¿Te refieres a ayudarte a armar la plantilla? Sí puedo, o como puedes encontrar en mi menú en la ventana de diseño, ayudé a dos chicas a modificar plantilla pre-diseñadas. Cualquier cosa me dices ;)

      ¡Saludos!

      Eliminar
  4. Hola!
    Me gusta mucho este tipo de entradas porque aprendo cosas de las que no tenía ni idea. Quizás lo aplique próximamente en el blog.
    Gracias por compartir la info!
    Saludos

    ResponderEliminar
    Respuestas
    1. ¡Hola! Me alegro que te gusten, en su momento yo no conseguí mucha información así que quiero ayudarlos a ustedes =)

      ¡Saludos!

      Eliminar
  5. Hola! Siempre quise hacer esto en mi blog, pero no sabia cómo y tampoco tenía ganas de hacerlo jaja, ahora sólo me faltan las ganas. Gracias por la entrada, saludos!

    ResponderEliminar
    Respuestas
    1. ¡Hola! Sí, yo también tenía la duda así que mejor lo armé yo jajajaja

      Eliminar