17.1.11

Botones Locos con Javascript



Quieres unos botones que se sacudan como locos mientras pasas el Mouse por encima de ellos, aquí tengo un pequeño Script que encontré en Javascript.internet.com para que tus botones llamen la atención de tus usuarios con sus inusuales movimientos.

Pruébalos:

Código:

Primero el Script, este puedes colocarlo en cualquier parte, aunque recomiendo que siempre lo coloques en el <HEAD> del documento, aunque hacer esto en un Blog es muy complicado, yo por eso lo agregue directo al inicio de la entrada en el Html y funciona:


<SCRIPT LANGUAGE="JavaScript">

pos = 15;
TO = null;
function shake_funct2(object,speed)
{
  obj = eval(object)
  txt = clear_space(obj.value);
  if (pos == 15)
  {
   txt = txt + "   ";
   pos = -15;
  }
  else
  {
   txt = "   " + txt;
   pos = 15;
  }
  obj.value = txt;
  obj.style.width = parseInt(obj.style.width) + pos;
  obj = object
  sp = speed
  TO = setTimeout("shake_funct2(obj,sp)",speed);
}

function clear_space(text)
{
 while (text.substring(0,1) == " ")
 {
  text = text.substring(1,text.length);
 }
 while(text.substring(text.length-1,text.length) == " ")
 {
  text = text.substring(0,text.length-1);
 }
 return text;
}

function end_shake_funct2(object)
{
  clearTimeout(TO);
  obj = eval(object);
  txt = clear_space(obj.value);
  obj.value = txt;
  //alert(pos);
  if (pos == -15)
  {
   obj.style.width = parseInt(obj.style.width) +15;
  }
  pos = 15
}

</script>

Ahora los Botones, estos si lo puedes pegar donde quieras verlos:


<input onmouseout="end_shake_funct2(this)" onmouseover="shake_funct2(this,100)" type="button" value="Muevéte!" />
<input onmouseout="end_shake_funct2(this)" onmouseover="shake_funct2(this,50)" type="button" value="Más Rápido!" />

Creo que funciona en todos los Navegadores, pero la verdad no estoy seguro, lo importante que debes tener en cuenta es que la función Shake_funct2 ademas del elemento que deseas mover tiene un parámetro numérico que indica el tiempo de espera del movimiento por lo cual entre mayor sea este valor mas lento ira y viceversa .

Si te gusto el contenido no Olvides Comentar y Compartir



No hay comentarios:

Publicar un comentario