Links Text Zoom

Efecto Zoom al pasar el cursor por un Link. Aparece un texto que aumenta progresivamente hasta desaparecer en primer plano. Se puede mover por la pantalla arrastrando el mouse.

<style type=”text/css”>
<!–
body{
 background:black;
 cursor:crosshair;
 overflow:hidden;
 font-family:Verdana;
 font-size:10pt;
 color:white;
}
.zoom{
 visibility:visible;
 position:absolute;
 top:-50;
 font-family:Verdana;
 font-size:0pt;
}
.links, a{
 text-decoration:none;
 font-family:Verdana;
 font-size:10pt;
 color:white;
}
//–>
</style>

<script language=”javascript” type=”text/javascript”>
<!– Copyleft 2006 – 2009, ScriptShow – scriptshow@hotmail.com –>
<!– Feel free to use if you leave this header intact! –>
<!–
var x,y;
var timer;
var step=0;
var fsize=0;

miArray=new Array(‘[TL1]’,'[TL2]’,'[TL3]’,'[TL4]’);

function handlerMM(e){
 x=(!document.all)? e.pageX : event.clientX;
 y=(!document.all)? e.pageY : event.clientY;
}

function lkzoom(){
 if (fsize<=950){
 document.getElementById(‘zoom’).style.fontSize=fsize;
 document.getElementById(‘zoom’).style.left=x-(Math.floor(fsize/2));
 document.getElementById(‘zoom’).style.top=y-(Math.floor(fsize/2));
 step+=1;
 fsize+=step;
 timer=setTimeout(‘lkzoom()’,20);
}
 else {
 clearTimeout(timer);
 fsize=0;
 step=0;
 document.getElementById(‘zoom’).style.top=-2000;
 }
}

function change(t){
 mrc=”rgb(“+Math.round(Math.random()*256/1)+”,”+Math.round(Math.random()*256/1)+”,”+Math.round(Math.random()*256/1)+”)”;
 document.getElementById(‘zoom’).style.color=mrc;
 document.getElementById(‘zoom’).innerHTML=miArray[t-1];
 lkzoom();
}

document.onmousemove=handlerMM;
//–>
</script>

<DIV id=”zoom”></DIV>

<DIV id=”links” align=”center”><h1>Mueve el mouse sobre un link</h1>
<a href=”#” target=”_blank” onMouseOver=”change(‘1’)”>[textlink 1]</a>
<a href=”#” target=”_blank” onMouseOver=”change(‘2’)”>[textlink 2]</a>
<a href=”#” target=”_blank” onMouseOver=”change(‘3’)”>[textlink 3]</a>
<a href=”#” target=”_blank” onMouseOver=”change(‘4’)”>[textlink 4]</a>
<h5>Arrastra el mouse para ver el efecto</h5></DIV>

Espero sea útil.

Un Saludo.

Links Text Zoom

2 comentarios en “Links Text Zoom

    1. La variable a la que te refieres, sólo almacena el sentido del fade (ascendente 1, descendente 0). Es una forma de asegurar que el evento onmouse in/out está controlado, con el fin de evitar efectos no deseados.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s