Les sujets:

Les partenaires publicitaires:

Réponses populaires

Questions connexes

Les partenaires publicitaires:

Comment faire pour obtenir la position actuelle de la souris en javascript

Lorsque vos visiteurs se déplacent leurs curseurs de souris, vous pouvez suivre ces mouvements en utilisant javascript. Une fois que vous connaissez les coordonnées X et Y du curseur de l'utilisateur, vous pouvez programmer votre application pour interagir avec la souris. Créer sentiers de curseur qui suivent le curseur, animer des objets sur l'écran ou même écrire des jeux qui interagissent avec la souris de l'utilisateur. Pour capturer les mouvements de la souris sur une page Web, attachez un gestionnaire d'événement à votre document, et ajouter un peu de javascript sur votre page.

Instructions

  1. Ouvrez un document HTML et ajouter ce code à sa section:




    La propriété onmousemove crée un événement qui est déclenché lorsque vous déplacez votre souris sur le corps d'une page Web. Lorsque l'événement se déclenche, il appelle la fonction nommée getCoordinates javascript. La deuxième ligne de code crée un contrôle textarea qui affiche les positions de la souris lorsque vous vous déplacez la souris.

  2. Ajouter cette fonction javascript pour le document de section:



    Cette fonction ressemble à «l'événement» qui lui est passé lorsque le mouvement de la souris se produit. La fonction stocke ensuite clientX, clientY, pageX, PageY et screenX et screenY les valeurs de l'événement dans six variables. Les deux dernières lignes de l'affichage du code de ces valeurs dans la zone de texte que vous déplacez votre souris.

  3. Enregistrez le document HTML et l'ouvrir dans un navigateur. Lorsque vous vous déplacez votre souris sur la page Web, il affiche l'emplacement du pointeur.

Conseils Avertissements

  • Notez que la fonction javascript capture coordonnées X et Y pour les trois types de propriétés: client, la page et l'écran. ClientX et clientY, par exemple, détiennent de la souris par rapport à la position de la zone client du navigateur. ScreenX et screenY montrent la position par rapport à la totalité de l'écran. La valeur est égale à la valeur pageX clientX plus tout décalage qui se produit lorsqu'un utilisateur fait défiler vers la gauche ou la droite. La valeur de pageY égale à la valeur de clientY plus tout décalage qui se produit lorsqu'un utilisateur fait défiler haut ou le bas. Ces "page" les valeurs sont utiles pour détecter la position de la souris par rapport au bord supérieur gauche de la page Web réelle, indépendamment de savoir jusqu'où l'utilisateur fait défiler horizontalement ou verticalement.

Questions connexes

» » » » Comment faire pour obtenir la position actuelle de la souris en javascript