Foros del Web » Programando para Internet » Javascript »

¿Como se consigue este efecto? Imagen que tiembla.

Estas en el tema de ¿Como se consigue este efecto? Imagen que tiembla. en el foro de Javascript en Foros del Web. Buenos días, Me gustaría saber como puedo conseguir que el logo de mi página web tiemble cuando pasas el cursor sobre ella. Hay un ejemplo ...
  #1 (permalink)  
Antiguo 30/08/2013, 03:57
 
Fecha de Ingreso: agosto-2013
Ubicación: Valencia
Mensajes: 1
Antigüedad: 11 años, 2 meses
Puntos: 0
Pregunta ¿Como se consigue este efecto? Imagen que tiembla.

Buenos días,

Me gustaría saber como puedo conseguir que el logo de mi página web tiemble cuando pasas el cursor sobre ella. Hay un ejemplo funcionando en http://meriland.es, pero no he podido averiguar como.

Un saludo,
David.
  #2 (permalink)  
Antiguo 30/08/2013, 07:35
Avatar de lauser
Moderator Unix/Linux
 
Fecha de Ingreso: julio-2013
Ubicación: Odessa (Ukrania)
Mensajes: 3.278
Antigüedad: 11 años, 3 meses
Puntos: 401
Respuesta: ¿Como se consigue este efecto? Imagen que tiembla.

Coloca el siguiente código en HEAD ...

<style>
.shakeimage{
position:relative
}
</style>
<script language="JavaScript1.2">
//configura aquí la intensidad del movimiento aumentando o disminuyendo el número
var rector=5
///////No escribas a partir de aquí///////////
var stopit=0
var a=1
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit ==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}
function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}
</script>

... y el siguiente código para incluir la imagen...

<img src="logo.gif" class="shakeimage" onMouseOver="init(this);rattleimage()" onMouseOut="stoprattle(this)">
__________________
Los usuarios que te responden, lo hacen altruistamente y sin ánimo de lucro con el único fin de ayudarte. Se paciente y agradecido.
-SOLOLINUX-

Etiquetas: js, logo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:19.