Sur une application donnée, existe-t-il un moyen, peut-être dans les outils de développement, où je peux vérifier l'emplacement des pixels de mon survol de la souris?Comment puis-je vérifier l'emplacement des pixels de mon curseur?
Utilisez javascript pour obtenir l'emplacement du curseur.
document.addEventListener("mouseover", function(event) {
console.log(event.screenX, event.screenY);
}, false);
Obtenir la souris Cliquez sur Position:
<!DOCTYPE html>
<html>
<head>
<title>Move to Click Position</title>
<style type="text/css">
body {
background-color: #FFF;
margin: 30px;
margin-top: 10px;
}
#contentContainer {
width: 550px;
height: 350px;
border: 5px black solid;
overflow: hidden;
background-color: #F2F2F2;
cursor: pointer;
}
#thing {
position: relative;
left: 50px;
top: 50px;
transition: left .5s ease-in, top .5s ease-in;
}
</style>
</head>
<body>
<div id="contentContainer">
<img id="thing" src="//www.kirupa.com/images/smiley_red.png">
</div>
<script src="//www.kirupa.com/prefixfree.min.js"></script>
<script>
var theThing = document.querySelector("#thing");
var container = document.querySelector("#contentContainer");
container.addEventListener("click", getClickPosition, false);
function getClickPosition(e) {
var parentPosition = getPosition(e.currentTarget);
var xPosition = e.clientX - parentPosition.x - (theThing.clientWidth/2);
var yPosition = e.clientY - parentPosition.y - (theThing.clientHeight/2);
theThing.style.left = xPosition + "px";
theThing.style.top = yPosition + "px";
}
// Helper function to get an element's exact position
function getPosition(el) {
var xPos = 0;
var yPos = 0;
while (el) {
if (el.tagName == "BODY") {
// deal with browser quirks with body/window/document and page scroll
var xScroll = el.scrollLeft || document.documentElement.scrollLeft;
var yScroll = el.scrollTop || document.documentElement.scrollTop;
xPos += (el.offsetLeft - xScroll + el.clientLeft);
yPos += (el.offsetTop - yScroll + el.clientTop);
} else {
// for all other non-BODY elements
xPos += (el.offsetLeft - el.scrollLeft + el.clientLeft);
yPos += (el.offsetTop - el.scrollTop + el.clientTop);
}
el = el.offsetParent;
}
return {
x: xPos,
y: yPos
};
}
</script>
</body>
</html>Reportez-vous: MouseEvent clientX Property & Getting the Mouse Click Position
double possible de [Est-il possible de dire débogueur Web Chrome pour montrer la position actuelle de la souris en coordonnées de page?] (Http://stackoverflow.com/questions/12888584/is-there-a-way -to-tell-chrome-web-débogueur-à-afficher-le-courant-souris-position-in) –