Don't mess up coordinates when resizing image

This commit is contained in:
ReiMerc 2023-02-06 13:23:12 +01:00
parent 1be6713c91
commit ffc497cdbd
2 changed files with 7 additions and 3 deletions

View File

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>noob</title> <title>Zipcode Finder</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<script src="script.js" defer></script> <script src="script.js" defer></script>
</head> </head>
@ -13,3 +13,4 @@
</main> </main>
</body> </body>
</html> </html>

View File

@ -1,3 +1,5 @@
"use strict";
var mouseX, mouseY; var mouseX, mouseY;
denmark.onmousemove = event => { denmark.onmousemove = event => {
@ -8,8 +10,8 @@ denmark.onmousemove = event => {
mouseX = event.x - rect.left; mouseX = event.x - rect.left;
mouseY = event.y - rect.top; mouseY = event.y - rect.top;
var coordX = mouseX * 0.00875 + 6; var coordX = mouseX / event.target.clientWidth * 8 + 6.2;
var coordY = Math.abs(mouseY * 0.0052 - 58); var coordY = Math.abs(mouseY / event.target.clientHeight * 3.6 - 57.93);
coords.innerHTML = `${coordX}<br>${coordY}`; coords.innerHTML = `${coordX}<br>${coordY}`;
@ -46,3 +48,4 @@ function onZipError() {
zip.style.top = (mouseY+3) + "px"; zip.style.top = (mouseY+3) + "px";
zip.style.display = "block"; zip.style.display = "block";
} }