J'ai un élément de canevas et lorsque je clique dessus, j'obtiens la position de clic avec e.clientX (Y) ou e.screenX (Y). Quelque chose d'étrange se passe. La valeur Y est toujours trop élevée. Veuillez regarder cette image: http://img840.imageshack.us/img840/268/eventq.jpg. Toute idée pourquoi est-ce si haut?La position de l'événement de clic (Y) est trop élevée
Je suis assez sûr que vous pouvez dire ce qui se passe. Vous n'avez pas les coordonnées par rapport à votre toile, mais par rapport à votre fenêtre. Cela dépend aussi de votre navigateur s'il inclut ou non un remplissage.
Convertissez-les en coordonnées normales. Dans votre cas, cela implique de soustraire le décalage de la toile.
offsetX ne fonctionne pas dans Firefox 3.6 – thomas
désolé, ne pas utiliser offsetX, j'ai édité le post – buddhabrot
Vous avez juste besoin de prendre le ClientX et Y et soustraire la position de la toile d'eux.
Cet exemple est inutilement bavard, juste pour montrer les étapes:
var canvas = document.getElementById('game');
var canvasX, canvasY;
canvas.addEventListener('click', function(event) {
canvasX = canvas.offsetLeft;
canvasY = canvas.offsetTop;
var eventX = event.clientX;
var eventY = event.clientY;
var relX = eventX - canvasX;
var relY = eventY - canvasY;
alert('X = ' + relX + ', Y = ' + relY);
});
échantillon de travail: http://jsfiddle.net/JfhJF/
est l'élément de la première toile/élément en haut de la page? La capture d'écran ne nous laisse pas voir le haut de la page. ClientY n'est pas relatif à l'élément en cours, mais à la page (fenêtre d'affichage) elle-même. – Fosco
Non il y a des textes ... Y a-t-il un moyen de l'obtenir par rapport à l'élément canvas? – thomas