El aspecto del cursor de determina con ayuda de la propiedad CSS
cursor.
Propiedad CSS
cursor nos permite instalar nuestro propio aspecto del cursor a los elementos de la página, además se puede utilizar tanto tipos estándares de cursores, como los determinados por el usuario (archivos
CUR o cursores
SVG).
Propiedad CSS
cursor es una propiedad para modificar el aspecto del cursor.
Para más simplicidad y comprensión dividimos los cursores por grupos...
Cursores estándar:
auto – es un cursor de predeterminado para el elemento actual.
crosshair– es un cruce (que parece al símbolo
+).
default– es un cursor que se utiliza se predeterminado en la plataforma actual. A menudo se expone en forma de una flecha.
pointer– es un cursor expuesto en forma de un indicador que significa un enlace.
move– es un cursor que determina el objeto que ha de estar trasladado.
e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize – son cursores que significan la posibilidad de mover una parte del objeto.
text– es un cursor que significa el texto que puede estar resaltado. Frecuentemente se expone en forma de una línea vertical "|".
wait– es un cursor que significa la ocupación de un programa y comunica al usuario que éste debe esperar. A menudo se expone en forma de esfera del reloj o reloj de arena.
help- es un cursor que significa que para el objeto indicado por él, hay una información de referencia. Muy a veces se expone en forma de un signo de interrogación o un globo.
Ejemplo de la utilización:
Code
SPAN.help { cursor : help; }
Cursor determinado por el usuario:
Puede surgir una situación cuando aparece la necesidad en un cursor extraordinario. Entonces habrá que indicar como valor de la propiedad
cursor:
Code
url ('ruta al cursor'), cursor estándar
he aquí varios ejemplos ilustrativos:
Code
{ cursor : url("my.cur"), text; } P { cursor : url("my.svg"), url("my.cur"), auto; }
Cuando el navegador se encuentra con la definición de un cursor personalizado, trata de exponer el primer cursor que hay en la lista. Si el primer cursor no puede estar expuesto, el navegador trata de aplicar el siguiente en la lista. Hay que prestar atención aquí que a final de la lista suele haber un cursor estándar. Se hace esto para instalar este cursor en caso de que los demás no hayan sido podido expuestos.
En calidad de los cursores personalizados se utilizan los archivos en formato
CUR,
ANI o cursores
SVG.
SVG cursor es un cursor personalizado donde el mismo cursor comparece como un archivo de la imagen. Hay que recordar también que deben utilizarse en un cursor como mínimo 2 colores con el fin de que éste sea distinguido en diferentes fondos.
Cursores personalizados se mantienen por
IE6,
Firefox 1.5.
Firefox 1.5 soporta los cursores
CUR y
SVG, con esto no soporta el formato
ANI.
Internet Explorer soporta los formatos
CUR y
ANI, pero no "entiende” cursores
SVG.
Propiedad
cursor es heredada.
También existe un valor más –
inherit. Este valor indica que la propiedad se hereda del elemento-padre.
Valor de la propiedad
cursor de predeterminado:
auto.
Al fin queríamos advertir que no se entusiasmen por los cursores personalizados, deben éstos utilizarse cuando de verdad surge tal necesidad. Por lo demás es mejor ir utilizando cursores estándares. ¡No lo olviden!