MouseEvent
==========

L'interface **`MouseEvent`** représente les événements qui se produisent lors d'une interaction de l'utilisateur avec un appareil de pointage (tel qu'une souris). Les événements communs utilisant cette interface incluent `click`, `dblclick`, `mouseup` et `mousedown`.

`MouseEvent` dérive de `UIEvent`, qui lui-même est issu d'`Event`. Bien que la méthode `MouseEvent.initMouseEvent()` (en-US) soit conservée à des fins de compatibilité descendante, la création d'un objet `MouseEvent` doit être effectuée à l'aide du constructeur `MouseEvent()` (en-US).

Plusieurs événements plus spécifiques sont basés sur `MouseEvent`, y compris `WheelEvent` et `DragEvent` (en-US).

Constructeur
------------

`MouseEvent()` (en-US)

crée un objet `MouseEvent`.

Propriétés
----------

*Cette interface hérite aussi des propriétés de ses parents* *`UIEvent` et `Event`.*

`MouseEvent.altKey` (en-US) Lecture seule 

renvoie `true` (*vrai*) si la touche

`alt`

est pressée lorsque l'événement est lancé.

`MouseEvent.button` (en-US) Lecture seule 

Le chiffre représentant le bouton qui est pressé lorsque l'événement est lancé.

`MouseEvent.buttons` (en-US) Lecture seule 

Les boutons qui sont pressés alors que l'événement est lancé.

`MouseEvent.clientX` (en-US) Lecture seule 

La coordonnée en X du pointeur de la souris dans les coordonnées locales (contenu du DOM).

`MouseEvent.clientY` (en-US) Lecture seule 

La coordonnée en Y du pointeur de la souris dans les coordonnées locales (contenu du DOM).

`MouseEvent.ctrlKey` (en-US) Lecture seule 

renvoie `true` si la touche

`ctrl`

est pressée alors que l'événement est lancé.

`MouseEvent.metaKey` (en-US) Lecture seule 

renvoie `true` si la touche

`méta`

est pressée alors que l'événement est lancé.

`MouseEvent.movementX` (en-US) Lecture seule 

La coordonnée en X du pointeur de la souris relative à la position de la souris lors du dernier événement `mousemove` lancé.

`MouseEvent.movementY` (en-US) Lecture seule 

La coordonnée en Y du pointeur de la souris relative à la position de la souris lors du dernier événement `mousemove` lancé.

`MouseEvent.offsetX` Lecture seule 
Expérimental

La coordonnée en X du pointeur de la souris relative à la postion du bord de remplissage du noeud cible.

`MouseEvent.offsetY` Lecture seule 
Expérimental

La coordonnée en Y du pointeur de la souris relative à la postion du bord de remplissage du noeud cible.

`MouseEvent.pageX` (en-US) Lecture seule 
Expérimental

La coordonnée en X du pointeur de la souris relative au document entier.

`MouseEvent.pageY` (en-US) Lecture seule 
Expérimental

La coordonnée en Y du pointeur de la souris relative au document entier.

`MouseEvent.region` (en-US) Lecture seule 

renvoie l'identifiant de la région touchée par l'évènement. Si aucune région n'est affectée, `null` est retourné.

`MouseEvent.relatedTarget` (en-US) Lecture seule 

La seconde cible pour l'événement, s'il y en a une.

`MouseEvent.screenX` (en-US) Lecture seule 

La coordonnée en X du pointeur de la souris de façon globale (par rapport à l'écran).

`MouseEvent.screenY` (en-US) Lecture seule 

La coordonnée en Y du pointeur de la souris de façon globale (par rapport à l'écran).

`MouseEvent.shiftKey` (en-US) Lecture seule 

renvoie `true` si la touche

`Maj`

est pressée alors que l'événement est lancé.

`MouseEvent.which` (en-US) Lecture seule 

Le bouton qui est pressé alors que l'événement est lancé.

MouseEvent.mozPressure 
Non-standard
 Lecture seule 

La quantité de pression appliquée à un appareil tactile ou tablette lors de la génération de l'événement ; l'amplitude de cette valeur se situe entre 0.0 (pression minimum) et 1.0 (pression maximum).

MouseEvent.mozInputSource 
Non-standard
 Lecture seule 

Le type d'appareil qui a généré l'événement (une des constantes `MOZ_SOURCE_*` listées ci-dessous). Ceci permet, par exemple, de déterminer si un événement de pointeur est généré par une souris ou par un événement tactile (qui pourrait affecter le degré de précision avec lequel il est possible d'interpréter les coordonnées associées à l'événement).

`MouseEvent.webkitForce` (en-US) 
Non-standard
 Lecture seule 

La quantité de pression appliquée en cliquant.

`MouseEvent.x` (en-US) 
Expérimental
Lecture seule 

Alias pour `MouseEvent.clientX` (en-US).

`MouseEvent.y` (en-US) 
Expérimental
Lecture seule 

Alias pour `MouseEvent.clientY` (en-US).

Constantes
----------

`MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN` (en-US) 
Non-standard
Lecture seule 

Force minimum nécessaire pour un click normal.

`MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN` (en-US) 
Non-standard
Lecture seule 

Force minimum nécessaire pour un click fort.

Les méthodes
------------

*Cette interface hérite aussi des méthodes de ses parents* *`UIEvent` et `Event`.*

`MouseEvent.getModifierState` (en-US)()

Retourne l'état actuel de la touche de modification spécifiée. Voir `KeyboardEvent.getModifierState` (en-US)() pour plus de détails.

`MouseEvent.initMouseEvent()` (en-US) 
Obsolète

initialise la valeur de l'`MouseEvent` créé. Si l'évènement a déjà été diffusé, la méthode ne produit rien.

Exemple
-------

Cet exemple illustre la simulation d'un clic (générant par programmation un événement click) sur une case à cocher en utilisant les méthodes DOM.


```js
function simulateClick() {
  var evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window,
  });
  var cb = document.getElementById("checkbox"); //élément pour cliquer
  var canceled = !cb.dispatchEvent(evt);
  if (canceled) {
    // Un gestionnaire appelé preventDefault
    alert("canceled");
  } else {
    // Aucun des gestionnaires n'est appelé preventDefault
    alert("not canceled");
  }
}
document.getElementById("button").addEventListener("click", simulateClick);
```



```html
<p>
  <label><input type="checkbox" id="checkbox" /> Checked</label>
</p>
<p><button id="button">Click me</button></p>
```


Cliquez sur le bouton pour voir comment l'exemple fonctionne :

Spécifications
--------------

| Specification |
| --- |
| UI Events # interface-mouseevent |
| CSSOM View Module # extensions-to-the-mouseevent-interface |
| Pointer Lock 2.0 # extensions-to-the-mouseevent-interface |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Son parent direct, `UIEvent`.
* `PointerEvent` : Pour les événements avancés du pointeur, y compris le multi-touch.