Ver Mensaje Individual
  #19 (permalink)  
Antiguo 23/11/2011, 13:26
furoya
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 4 meses
Puntos: 317
Respuesta: Cambiar el cursor del raton

Aprovecho que puse un enlace a éste en otro tema, y le doy otra vuelta de tuerca al asunto, basado en mi provervial testarudez.

Resulta que el sitio imayiyak no acepta que le suba ni punteros *.cur ni *.gif animados. Así que todo lo que estaba armando para actualizar el tema lo tuve que resolver prescindiendo de su servicio.

Metí todo en un comprimido y lo subí a megaplod.


http://www.megaupload.com/?d=YRZGYTUB

Nombre del archivo: cursorAnimado.rar
Descripción del archivo: ejemplos de cursor animado para "Cambiar el cursor del raton" en Foros del Web
Tamaño del archivo: 34.65 KB


Lo que sí pude actualizar es ese ejemplo que buzu decía que no andaba. Ahora lo probé en una versión más nueva de Firefox, y tampoco me anda.

Pero en Chrome, sí. Así que el truco es basicamente para FF.

Como era con imágenes, en vez de seguir sacando las de este Foro, aprovecho que a las *.png si las puedo colgar de la web y dejo la actualización también acá.

Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head> <title>CURSOR ANIMADO.</title>
<script>

var imagCur = new Array()
imagCur[0] = new Image();

imagCur[0].src = "http://img842.imageshack.us/img842/8786/punterocohete0.png";
imagCur[1] = new Image();
imagCur[1].src = "http://img708.imageshack.us/img708/4721/punterocohete1.png";
imagCur[2] = new Image();
imagCur[2].src = "http://img841.imageshack.us/img841/3111/punterocohete2.png";
imagCur[3] = new Image();
imagCur[3].src = "http://img708.imageshack.us/img708/3007/punterocohete3.png";
imagCur[4] = new Image();
imagCur[4].src = imagCur[2].src;
imagCur[5] = new Image();
imagCur[5].src = imagCur[1].src;

var num = 0;

function cursorAnimado0() {
document.getElementsByTagName('html')[0].style.cursor = 
"url(" + imagCur[num].src + "), help";

num = (num == 5) ? 0 : num+1;

setTimeout(cursorAnimado0, 120);
}

onload = cursorAnimado0;
</script>

<style type="text/css">
html {height: 100%; }
body {background-color: black; color: yellow; font-size: 18px; }
div {height: 100px; width: 300px; background-color: red; color: navy; 
padding: 15px; cursor: url("http://static.forosdelweb.com/fdwtheme/images/smilies/porra.gif") , wait; 
font-weight: bold; }
a {background-color: white; }
</style>

</head>
<body>
<h2>El puntero tiene una animaci&oacute;n "cuadro a cuadro" 
armado con una serie de im&aacute;genes.</h2>

<p>S&oacute;lo para Firefox y Chrome.</p>

<p>Im&aacute;genes : 

<img src="http://img842.imageshack.us/img842/8786/punterocohete0.png" align=middle> ; 
<img src="http://img708.imageshack.us/img708/4721/punterocohete1.png" align=middle> ; 
<img src="http://img841.imageshack.us/img841/3111/punterocohete2.png" align=middle> ;
<img src="http://img708.imageshack.us/img708/3007/punterocohete3.png" align=middle> ( 
<i>punteroCohete0.png</i>; 
<i>punteroCohete1.png</i>; 
<i>punteroCohete2.png</i>;
<i>punteroCohete3.png</i>. )

<div> Aqu&iacute; un cursor animado hecho con <br>
<center><img src="http://static.forosdelweb.com/fdwtheme/images/smilies/porra.gif"> <br>
<i>porra.gif</i> . </center>
</div></p>

<p><input type="text" value="EDITABLE"><br>

<a href=
"http://www.forosdelweb.com/f53/cambiar-cursor-del-raton-364551/">
Cambiar el cursor del raton</a> (<b>Foros del Web</b>)<br></p>

</body>
</html> 
Como verán, Chrome también acepta *.gif animados de cualquier tamaño (o casi), pero a éste sí lo saqué de FdW, el original lo van a tener que buscar en el comprimido, porque imeiyiyak no me lo deja subir.

Está probado en forma local, aunque como en el tema

poner una imagen al cursor

ya emprear mostró que todavía se puede usar un puntero personalizado en CSS, entonces supongo que todo este engendro deberá andar también colgado en la web.

Las imágenes que no son punteros reales no andan en IE, y el cursor personalizado en general, no anda en Opera.

Imágenes :