Actualizado el 10-02-2007
versión para imprimir

Cursores y estilo

auto

Pasea aqui el cursor

crosshair

Pasea aqui el cursor

default

Pasea aqui el cursor

pointer

Pasea aqui el cursor

move

Pasea aqui el cursor

e-resize

Pasea aqui el cursor

ne-resize

Pasea aqui el cursor

nw-resize

Pasea aqui el cursor

n-resize

Pasea aqui el cursor

se-resize

Pasea aqui el cursor

sw-resize

Pasea aqui el cursor

w-resize

Pasea aqui el cursor

s-resize

Pasea aqui el cursor

text

Pasea aqui el cursor

wait

Pasea aqui el cursor

progress

Pasea aqui el cursor

help

Pasea aqui el cursor

Con CSS2 podemos determinar la apariencia del cursor cuando este apunte sobre cualquier elemento de nuestra página, mediante la declaración cursor: estilo

En la tabla de la izquierda tienes los estilos disponibles.

La especificación CSS2 tambien contempla el uso de cursores distintos de los proporcionados por el sistema. En este caso debes señalar la URI donde está el gráfico a utilizar:

P { cursor : url("micursor.cur"), url("otro.cur"), text; }

Como puedes comprobar, se trata de tipos de gráficos especiales. Dos ejemplos, cursor fijo y animado:

NOTAS: las versiones 5 y 5.5 de iexplorer usan cursor:hand en lugar de cursor:pointer. Pointer es aceptado por mozilla y iexplorer 6.

Para que los navegadores basados en Mozilla reconozcan cursor:url es preciso añadir tras la url una keyword como auto o pointer por ejemplo:style="cursor : url('ejemplos/blue.cur'),auto.

Firefox no admite (hasta la version 1.5 al menos) cursores animados.

Los tipos de imagenes recomendados son cur y ani. La especificación menciona el tipo csr del que no tengo referencias.

Como suele suceder, hay extensiones propietarias.

This site powered by Phorum.