| Sección
"Java Scripts" |
|
Lección
60 |
Una
carita pegada al cursor
Este
Script hace que una carita u otra imagen siga al cursor, para
activarlo, pegas este código en cualquier
sector de tu sitio, pero siempre debajo de donde
dice <Body> en el HTML de tu página:
<script>
B=document.all;
C=document.layers;
T1=new Array("carita.gif",36,35)
nos=parseInt(T1.length/3)
rate=50
ie5fix1=0;
ie5fix2=0;
for (i=0;i<nos;i++){
createContainer("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>")}
function createContainer(N,Xp,Yp,W,H,At,HT,Op,St){
with (document){
write((!B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; ");
if(St){
if (C)
write(" style='");
write(St+";' ")
}
else write((B)?"'":"");
write((At)? At+">" : ">");
write((HT) ? HT : "");
if (!Op)
closeContainer(N)
}
}
function closeContainer(){
document.write((B)?"</div>":"</layer>")
}
function getXpos(N){
return (B) ? parseInt(B[N].style.left) : C[N].left
}
function getYpos(N){
return (B) ? parseInt(B[N].style.top) : C[N].top
}
function moveContainer(N,DX,DY){
c=(B) ? B[N].style :C[N];c.left=DX;c.top=DY
}
function cycle(){
if (document.all&&window.print){
ie5fix1=document.body.scrollLeft;
ie5fix2=document.body.scrollTop;
}
for (i=0;i<(nos-1);i++){
moveContainer("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1)))
}
}
function newPos(e){
moveContainer("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2
)
}
if(document.layers)
document.captureEvents(Event.MOUSEMOVE)
document.onmousemove=newPos
setInterval("cycle()",rate)
</script>
</body> |
Lo
que pinté con rojo corresponde al nombre de la
imagen que sigue al cursor, la cual debes guardar
en tu disco duro, en la misma carpeta que
guardarás tu pagina con el efecto.
Si
deseas esa misma imagen, la tomas con el botón
derecho del ratón de aquí:
Y
aquí lo tienes al mismo archivo, listo para
cortar y pegar en tu página:
Para
ello haces click en cualquier palabra que se halla
dentro de la caja, Te diriges a "Edición"
en el menú superior de la barra de herramientas,
e indicas "Seleccionar todo", luego tomas
lo seleccionado dirigiéndote nuevamente a
"Edición", pero esta vez indicas
"Cortar", y posteriormente te posicionas
en tu página, donde quieres colocar este código,
entonces te diriges a Edición, y le indicas
"Pegar".
Si
deseas hacer las cosas más rápido, puedes
verificar en "Edición" (está escrito
al lado de las palabras que indican cada orden)
que pulsando "Control" + una letra
determinada, puedes "seleccionar todo",
"cortar" o "pegar" en forma
instantánea y con eso evitas tener que ingresar
constantemente al menú de "Edición".
Esto
es lo que debes pegar debajo de donde dice <Body>
en el HTML de tu página:
Si
de todos modos, no funciona este efecto, corta el
código HTML que debes colocar en tu página, pero
antes de hacerlo, pégalo en tu Block de notas, y
luego si córtalo de allí y pégalo en tu sitio.
Ahora si no creo que haya ningún inconveniente
que te impida disfrutar de este bonito efecto.
Recordemos
que este Script también puede ser hallado en el
programa Depósito, el cual puedes bajar de aquí:
webtutorial.com.ar
Buena
suerte.
|
