14 ago. 2011

Efecto de sacudido en enlaces


Aquí les tengo un truquito!...Hace Tiempo que no publicaba uno, espero q ayude a hermosear su blog! o incluso a sorprender a muchos.
Recuerden no sobrecargar el blog, eso tampoco es tan agradable a la vista!.
Bueno..comencemos!
El efecto de sacudido es un efecto que al hacer click sobre un enlace o elemento éste se sacude de un lado a otro.


Ver Ejemplo en el Blog de Prueba

Para poner este Efecto Se dirigen a Diseño, luego Edición de HTML y con Control+f buscan </head> y justo antes de eso colocan lo siguiente:

<!-- Prototype y Scriptaculous-->
<script src='http://www.google.com/jsapi'/>
<script>
google.load(&quot;prototype&quot;,&quot;1.6.0.3&quot;);
google.load(&quot;scriptaculous&quot;, &quot;1.8.2&quot;);
</script>
<!-- Prototype y Scriptaculous-->
<script type='text/javascript'>

function ShakeEffect(element){
new Effect.Shake(element);
}

</script>


Colocar antes de guardar vista previa para verificar que no haya ocurrido ningún cambio desagradable en nuestro blog.
Luego solamente para utilizar este efecto en sus imágenes deben colocar el URL de ella junto con el URL de algún enlace en el siguiente código:

<a href="URL del enlace"onclick="ShakeEffect(this);"><img src="URL de la imagen" /></a>

Si lo desean colocar en un enlace de texto sería con este código:

<a href="URL del enlace" onclick="ShakeEffect(this);">Texto del enlace
</a>

Ahora si quieres que este efecto quede como el mio y se aplique sólo al pasar el cursor y no al hacer click inmediatamente sobre la imagen o texto, sólo debes cambiar dónde diga onclick por onmouseover.

Éxito!
Créditos: Ciudad Blogger

4 comentarios:

  1. disculpa pero k tipo de enlace

    ResponderEliminar
  2. Sludos...en mi blog tengo el enlace de descarga en una imagen...clic para ver o descargar, como le hago para tener ese efecto de sacudida
    espero me contestes, pues no entendi en ejemplo que pones,bye

    ResponderEliminar
  3. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  4. Este comentario ha sido eliminado por el autor.

    ResponderEliminar

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
ir arriba