Usare le URL nella proprietà cursor

Da MDC.

Gecko 1.8 (Firefox 1.5, SeaMonkey 1.0) supporta valori URL per la proprietà "cursor" dei CSS2 (EN). Questo permette di utilizzare una qualsiasi immagine desiderata come cursore del mouse — può essere usato un qualsiasi formato per immagini supportato da Gecko.

[modifica] Sintassi

La sintassi per questa proprietà è:

cursor: [<url>,]* parola-chiave;

Questo significa che possono essere specificati zero o più indirizzi URL (separati da una virgola), che devono essere seguiti da una delle parole-chiave definite nelle specfiche CSS , come auto o pointer (puntatore).

Ad esempio, quanto segue è permesso:

cursor: url(foo.cur), url(http://www.example.com/bar.gif), auto;

In questo modo sarà caricato per primo foo.cur. Se quel file non esiste oppure non è disponibile per altre ragioni, verrà caricato bar.gif, ed infine, se il caricamento di nessuno dei due file andrà a buon fine, verrà utilizzato il valore auto.

In Gecko 1.8beta3 è stato implementato il supporto per le specifiche CSS3 relative alla sintassi per i valori della proprietà "cursor", che quindi funzionano in Firefox 1.5. Questo permette di specificare le coordinate della hotspot del cursore, che sarà bloccata ai bordi dell'immagine del cursore. Se non vengono determinate, le cordinate della hotspot o sono lette dal file stesso (in caso di file CUR e XBM) o sono impostate sull'angolo in alto a sinistra dell'immagine. Un'esempio della sintassi CSS3:

cursor: url(foo.png) 4 12, auto;

Il primo numero rappresenta l'ascissa (asse delle x), il secondo l'ordinata (asse delle y). Nell'esempio la hotspot è impostata ai pixel distanti (4,12) dall'angolo superiore sinistro (0,0).

[modifica] Limitazioni

Possono essere utilizzati tutti i formati per immagine supportati da Gecko. Questo significa che sono utilizzabili immagini BMP, JPG, CUR, GIF, etc. Il formato ANI non è però supportato, e qualora fosse specificata una GIF animata, il cursore resterebbe non animato. Queste limitazioni potrebbero essere rimosse nelle versioni future.

Gecko non pone limitazioni alla dimensione del cursore. E' però consigliabile di limitarsi ad una dimensione di 32x32 per avere la massima compatibilità con i vari sistemi operativi e le diverse piattaforme. In particolare i cursori più larghi non funzionano su Windows 9x (95, 98, ME).

I cursori trasparenti non vengono supportati nelle versioni per Windows anteriori a Win XP a causa di una limitazione dei sistemi operativi. La trasparenza funziona su tutte le piattaforme.

Solo le versioni di Mozilla per Windows, OS/2 e Linux (usando GTK+ 2.4 o superiore) supportano degli indirizzi URL come valori per i cursori. Il supporto per le altre piattaforme potrebbe essere aggiunto nelle future versioni (Mac OS: bug 286304, QNX Neutrino: bug 286307, XLib: bug 286309, Qt: bug 286310, BeOS: bug 298184, GTK 2.0/2.2: bug 308536)

[modifica] Compatibilità con altri browser

Anche Microsoft Internet Explorer supporta indirizzi URI come valori per la proprietà cursor. Però accetta solo i formati CUR e ANI.

E' anche meno aderente alla sintassi per la proprietà cursor. Valori come:

cursor: url(foo.cur);

o:

cursor: url(foo.cur), pointer, url(bar.cur), auto;

funzionano su MSIE, ma non nei browser basati su Gecko. Per la compatibilità con Gecko e il rispetto delle specifiche CSS è necessario elencare sempre prima tutti gli indirizzi URI e usare esclusivamente una sola parola-chiave come valore finale.

To-do: document what MSIE does with CSS 3 hotspot locations