Idees
[ Tornar a la pàgina d'informàtica ]

Un ratón loco

Sorprenda a sus visitantes proporcionándoles simultáneamente con cuatro apuntadores de ratón. ¿Cuál es el bueno? ¡Haga clic para saberlo! Proceda de la siguiente manera para lograr este efecto:

Inserte el siguiente script en el encabezamiento de su página:

<SCRIPT>
var ms=navigator.appVersion.indexOf("MSIE");
var ie4=(ms>0)&&(parseInt(navigator.appVersion.substring(ms+5,ms+6))>=4);
var img=0;
var img1=0;

function bouge(e){
document.all.pointeur1.style.left=(event.clientX-200);
document.all.pointeur1.style.top=(event.clientY+50+document.body.scrollTop);
document.all.pointeur2.style.left=(event.clientX+200);
document.all.pointeur2.style.top=(event.clientY-50+document.body.scrollTop);
document.all.pointeur3.style.left=(event.clientX-20);
document.all.pointeur3.style.top=(event.clientY-200+document.body.scrollTop);
document.all.pointeur4.style.left=(event.clientX+30);
document.all.pointeur4.style.top=(event.clientY+50+document.body.scrollTop);
}

function bougenet(e){
for (m=0;m<16;m++){
document.pointeur1.left=(e.pageX)-200;
document.pointeur1.top=(e.pageY)-200;
document.pointeur2.left=(e.pageX)+200;
document.pointeur2.top=(e.pageY)-50;
document.pointeur3.left=(e.pageX)-20;
document.pointeur3.top=(e.pageY)-200;
document.pointeur4.left=(e.pageX)+30;
document.pointeur4.top=(e.pageY)+50;
}
}
</SCRIPT>
Sólo necesita personalizar este script cambiando el lugar de los diferentes cursores. La distancia entre el verdadero apuntador y el apuntador falso está especificada en píxeles.

Ahora, cree otros apuntadores copiando el siguiente código entre las etiquetas <body> y </body>:

<div id="pointeur1" STYLE="position:absolute;top:20; left:20; height:30; width:30;">
<img src="pointeur.gif" width="30" height="30">
</style></div>
<div id="pointeur2" STYLE="position:absolute;top:20; left:20; height:30; width:30;">
<img src="pointeur.gif" width="30" height="30">
</style></div>
<div id="pointeur3" STYLE="position:absolute;top:20; left:20; height:30; width:30;">
<img src="pointeur.gif" width="30" height="30">
</style></div>
<div id="pointeur4" STYLE="position:absolute;top:20; left:20; height:30; width:30;">
<img src="pointeur.gif" width="30" height="30">
</style></div>
<script>
if (ie4>0){
document.onmousemove = bouge;}
else{
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = bougenet;
}

</script>
Ahora, necesita sólo copiar la imagen del cursor en su sitio. Aquí, está:



Figura 1: Apuntador del ratón que se debe utilizar.

¿Un juego de niños, cierto?