La spécification W3C pour la propriété CSS cursor présente une multitude de valeurs possibles, correspondant à tout type d'interaction : lien, redimensionnement, progression, sélection de texte, glisser-déposer...
En voulant redéfinir la propriété cursor (pour le redimensionnement d'une fenêtre), j'ai remarqué que cela ne fonctionnait pas comme attendu. J'ai donc fait un test avec toutes les valeurs possibles (ou presque). En voici les résultats, et le moins que l'on puisse dire c'est que le support de cette propriété dans AIR est plutôt limité.
Comportement de la propriété
Note : les types de curseurs qui ont un mauvais comportement sont affichés en gras.
Curseur d'images
- url : ne prend pas en compte la déclaration d'image et affiche un curseur de type default
Curseurs généraux
- auto : affiche alternativement un curseur de type text ou default.
- default : affiche un curseur de type default
- hand : affiche un curseur de type default
- none : affiche un curseur de type default
Curseurs de lien et de statut
- context-menu : affiche un curseur de type default
- help : affiche un curseur de type default
- pointer : affiche le curseur de lien
- progress : affiche un curseur de type default
- wait : affiche un curseur de type default
Curseurs de sélection
- cell : affiche un curseur de type default
- crosshair : affiche un curseur de type default
- text : affiche le curseur de texte
- vertical-text : affiche un curseur de type default
Curseurs pour le glisser-déposer
- alias : affiche un curseur de type default
- copy : affiche un curseur de type default
- move : affiche un curseur de type default
- no-drop : affiche un curseur de type default
- not-allowed : affiche un curseur de type default
Curseurs pour le redimensionnement et le défilement
- all-scroll : affiche une main comme le curseur "move"
- col-resize : affiche un curseur de type default
- e-resize : affiche un curseur de type default
- ew-resize : affiche un curseur de type default
- n-resize : affiche un curseur de type default
- ne-resize : affiche un curseur de type default
- ns-resize : affiche un curseur de type default
- nesw-resize : affiche un curseur de type default
- nw-resize : affiche un curseur de type default
- nwse-resize : affiche un curseur de type default
- row-resize : affiche un curseur de type default
- s-resize : affiche un curseur de type default
- se-resize : affiche un curseur de type default
- sw-resize : affiche un curseur de type default
- w-resize : affiche un curseur de type default
Curseurs spécifiques à Webkit
- -webkit-grab : affiche un curseur de type default
- -webkit-grabbing : affiche un curseur de type default
- -webkit-zoom-in : affiche un curseur de type default
- -webkit-zoom-out : affiche un curseur de type default
Comme vous le voyez, le support de cette propriété CSS est plutôt faible. Cela devient gênant dans certains cas, notamment quand vous voulez notifier l'utilisateur que la zone sur laquelle se trouve sa souris permet le redimensionnement par exemple.
Je n'ai pour l'instant pas trouvé d'alternative possible, en dehors peut être du javascript.
Liens utiles
- Test de la propriété cursor chez Webkit : http://trac.webkit.org/export/37902/trunk/WebCore/manual-tests/cursor.html
- Spécification W3C de la propriété cursor : http://www.w3.org/TR/css3-ui/#cursor
Merci pour les infos!
ça manque un peu de ressources sur le sujet css+air donc merci pour le blodair
bonne continuation!
Merci pour votre soutien. Mon blog tourne un peu au ralenti depuis quelques mois pour des raisons professionnelles, mais je compte bien continuer d'étoffer modestement les ressources francophones sur AIR.