Puntatori

Qualora te lo chiedessi, sì, puoi modificare anche l’aspetto del cursore del mouse sulla tua pagina HTML. Grazie alla proprietà cursor, infatti, puoi cambiarlo come meglio credi. Mi raccomando però, cambiare il cursore del mouse all’evento :hover dei link non è molto saggio. Rischieresti solo di creare confusione nel povero utente del tuo sito!

I possibili valori di cursor sono molti e rappresentano tutte le possibili icone che il puntatore del mouse può avere. Inoltre, puoi utilizzare anche un’immagine, qualora non volessi utilizzare un’icona predefinita¹. Tutte le possibili icone sono: auto, alias, all-scroll, cell, context-menu, col-resize, copy, crosshair, default, e-resize, ew-resize, help, move, n-resize, ne-resize, nesw-resize, ns-resize, nw-resize, nwse-resize, no-drop, not-allowed, pointer, progress, row-resize, s-resize, se-resize, sw-resize, text, url()², vertical-text, w-resize, wait, zoom-in, zoom-out, none.

See the Pen oDJrc by Giovanni Buffa (@gioppy) on CodePen

1. Ci potrebbero essere delle differenze tra i sistemi operativi in merito alle icone utilizzate per il puntatore. Ad esempio, su Apple OSX wait e progress producono lo stesso risultato, diversamente che su Microsoft Windows. Ricorda, inoltre, che questa proprietà non funziona su dispositivi touch.

2. Gli unici formati ammessi sono .gif e .cur, con l’aggiunta del valore default, preceduto da virgola.