Événements tactiles

Découvrez les bases de l'utilisation des événements tactiles en JavaScript

En savoir plus surÉvénements JavaScript

Les événements tactiles sont les événements qui sont déclenchés lors de l'affichage de la page sur un appareil mobile, comme un smartphone ou une tablette.

Ils vous permettent de suivre les événements multitouch.

Nous avons 4 événements tactiles:

  • touchstartun événement tactile a commencé (la surface est touchée)
  • touchendun événement tactile est terminé (la surface n'est plus touchée)
  • touchmovele doigt (ou tout ce qui touche l'appareil) se déplace sur la surface
  • touchcancell'événement tactile a été annulé

Chaque fois qu'un événement tactile se produit, unévénement tactile:

const link = document.getElementById('my-link')
link.addEventListener('touchstart', event => {
  // touch event started
})

Voici toutes les propriétés auxquelles nous pouvons accéder lors de cet événement

  • identifierun identifiant unique pour cet événement spécifique. Utilisé pour suivre les événements multi-touch. Même doigt = même identifiant.
  • clientX/clientYles coordonnées x et y du pointeur de la souris par rapport à la fenêtre du navigateur, quel que soit le défilement
  • screenX/screenYles coordonnées x et y du pointeur de la souris dans les coordonnées de l'écran
  • pageX/pageYles coordonnées x et y du pointeur de la souris dans les coordonnées de la page (y compris le défilement)
  • targetl'élément touché

Téléchargez mon gratuitManuel du débutant JavaScript


Plus de didacticiels sur le navigateur: