Lacaractéristique médiaCSSpointer permet de tester si l'utilisateur·ice dispose d'un dispositif de pointage (comme une souris) et, le cas échéant, d'évaluer la précision du dispositif de pointage principal.

Syntaxe

Cette caractéristique est définie avec un mot-clé parmi les suivants :

none

Le mécanisme de saisie principal n'inclut pas de dispositif de pointage.

coarse

Le mécanisme de saisie principal inclut un dispositif de pointage dont la précision est limitée.

fine

Le mécanisme de saisie principal inclut un dispositif de pointage précis.

Exemples

Dans cet exemple, on crée une petite case à cocher pour les utilisateurs qui disposent d'un pointage précis et une case à cocher plus grande lorsque le mécanisme de pointage est moins précis.

HTML

<input type="checkbox" /> <label for="test">Coucou !</label>

CSS

input[type="checkbox"]:checked {  background: gray;}@media (pointer: fine) {  input[type="checkbox"] {    -moz-appearance: none;    -webkit-appearance: none;    appearance: none;    width: 15px;    height: 15px;    border: 1px solid blue;  }}@media (pointer: coarse) {  input[type="checkbox"] {    -moz-appearance: none;    -webkit-appearance: none;    appearance: none;    width: 30px;    height: 30px;    border: 2px solid red;  }}

Résultat

Spécifications

Compatibilité des navigateurs

Voir aussi

• La caractéristique médiaany-pointer