pointer

pointer est une caractéristique média CSS (cf. @media) qui permet de vérifier si le dispositif de saisie/d'entrée principal est un dispositif de pointage et, le cas échéant, de connaître sa précision.

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

HTML

<input id="test" 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

Spécification État Commentaires
Media Queries Level 4
La définition de 'pointer' dans cette spécification.		 Version de travail Ajout dans la spécification de niveau 4 pour les requêtes média.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Edge Internet Explorer Opera Safari
Support simple 41 Pas de support[2] 20 ou moins (12) Nightly build 28 9.0 [1]
Fonctionnalité Android Chrome pour Andorid Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple Pas de support 50 Pas de support[2] 36 ? 9.2

[1] Implémenté avec le bug n°134822 de WebKit

[2] bug 1035774 – Implement Interaction Media Features including pointer:coarse that replaces non-standard -moz-touch-enabled

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,