Skip to content

Instantly share code, notes, and snippets.

@NicholasEli
Created January 19, 2017 00:06
Show Gist options
  • Save NicholasEli/dd726153f06f177fd11a7867a6da6f6a to your computer and use it in GitHub Desktop.
Save NicholasEli/dd726153f06f177fd11a7867a6da6f6a to your computer and use it in GitHub Desktop.
const image_coordinates = (img) =>{
document.querySelector(img).addEventListener('click', (event) =>{
let target = event.currentTarget.getBoundingClientRect(),
target_w = target.width,
target_h = target.height,
target_x = target.left,
target_y = target.top,
x_pos = event.clientX,
y_pos = event.clientY;
let x_diff = x_pos - target_x,
y_diff = y_pos - target_y,
points_calc = [
{
x_percentage : `${(x_diff / target_w) * 100}%`,
y_percentage : `${(y_diff / target_h) * 100}%`
}
]
console.table(points_calc);
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment