screeny
Décalage de la souris dans le coin supérieur gauche de l'écran du moniteur
piste
Le décalage de la souris dans le coin supérieur gauche de la page (sa valeur ne sera pas affectée par la barre de défilement)
Cette propriété n'est pas prise en charge sous IE9
Mais vous pouvez écrire du code pour le calculer. Implémentation dans jQuery:
La copie de code est la suivante:
// Calculez Pagex / Y si manquant et Clientx / Y disponible
if (event.pagex == null && original.clientx! = null) {
eventDoc = event.target.ownerDocument || document;
doc = eventDoc.DocumentElement;
body = eventdoc.body;
event.pagex = original.clientx + (doc && doc.scrollleft || body && body.scrollleft || 0) - (doc && doc.clientleft ||| body && body.clientleft || 0);
event.pagey = original.clienty + (doc && doc.scrolltop || body && body.scrolltop || 0) - (doc && doc.clienttop || body && body.clienttop || 0);
}
Il suffit de l'implémenter simplement.
Le décalage de la souris par rapport à la fenêtre du navigateur plus la hauteur cachée de la barre de défilement du document moins le client client du document.
La copie de code est la suivante:
var pagey = event.clienty + document.DocumentElement. ScrollTop-Document.DocumentElement.ClientTop
Pourquoi soustraire document.DocumentElement.clienttop
Ceci est le décalage du document spécifique au navigateur sous IE8. Même si le HTML est réglé sur 0, le rembourrage et la marge du corps n'affecteront pas sa valeur.
Testé sous IE7, obtenez
La copie de code est la suivante:
document.DocumentElement.ClientTop -> 2px document.DocumentElement.Clientleft -> 2px
document.bocy.clienttop -> 0px document.body.clientleft -> 0px
clientèle
Décalage de la souris dans le coin supérieur gauche de la fenêtre de navigateur
Faites attention à la différence entre la clientèle et Pagey. La valeur de la clientèle est équivalente à Pagey lorsqu'il n'y a pas de barre de défilement sur la page.
----------------------------------segmentation-----------------------------------------------
fossé
Si le style de position d'un élément n'est pas la statique par défaut, nous disons que cet élément a des attributs de positionnement.
Trouvez l'élément le plus proche avec les attributs de positionnement dans l'élément qui déclenche actuellement l'événement de la souris et ses éléments d'ancêtre, calculez la valeur de décalage de la souris de celui-ci pour trouver le point diplomatique dans le coin supérieur gauche de la bordure de l'élément comme point relatif. Si un élément avec l'attribut de positionnement ne peut être trouvé, le décalage est calculé par rapport à la page actuelle, ce qui équivaut à Pagey pour le moment.
Cet attribut n'est pas pris en charge sous IE9, mais il peut être remplacé par son décalage unique.
compenser
IE Propriétés spécifiques
La différence entre le décalage et le layery est que lors du calcul de la valeur de décalage, le premier est relatif au point d'intersection intérieur dans le coin supérieur gauche du bord de l'élément. Par conséquent, lorsque la souris est à la bordure de l'élément, la valeur de décalage est une valeur négative. De plus, Offsety ne se soucie pas de savoir si l'élément qui déclenche l'événement a des attributs de positionnement. Il calcule toujours la valeur de décalage par rapport à l'élément qui déclenche l'événement.
Compte tenu de la différence entre le layery et la compensation, vous devez prêter attention à l'utilisation de deux compatibles.
1. L'élément qui déclenche l'événement doit définir l'attribut de positionnement.
2. Lorsque l'élément a la bordure supérieure, la couche a une valeur de largeur de bordure de bordure de plus que la valeur de Offsety.
La copie de code est la suivante:
// L'élément.BorterTopWidth ici doit être la largeur de bordure supérieure de l'élément réellement calculé.
var borderTopWidth = window.getCompuledStyle? window.getCompuledStyle (élément, null) .BorterTopWidth: element.currentStyle.BorderTopWidth;
var offSety = event.offSety || (event.layery + borderTopWidth);
Grâce aux propriétés de la couche et de décalage, il est très pratique de calculer le décalage de la souris par rapport à l'élément d'événement de la souris lié, qui est très utile à certains moments.
Ici, nous parlons de l'attribut décalé de la direction verticale de la souris. Le décalage dans la direction horizontale est similaire, donc nous n'en discuterons plus.
Ce qui précède est tout sur cet article, j'espère que vous l'aimez.