Skip to content

Instantly share code, notes, and snippets.

@steveharoz
Last active November 11, 2016 23:05
Show Gist options
  • Save steveharoz/96a6d342d2369028af44793ef3f69bbb to your computer and use it in GitHub Desktop.
Save steveharoz/96a6d342d2369028af44793ef3f69bbb to your computer and use it in GitHub Desktop.
click location
border: no
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PAGE TITLE</title>
<style>
img {
border: 2px solid black;
cursor: crosshair;
}
</style>
</head>
<body>
<h1>Click the image</h1>
<img
src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Chicago_Cubs_Logo.svg/476px-Chicago_Cubs_Logo.svg.png"
width="300"
onclick="
var outputString = 'X:' + event.offsetX + ' Y:' + event.offsetY;
document.getElementById('location_text').textContent = outputString;"
/>
<p id="location_text"></p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment