I have an HTML page with a canvas in the body defined as so:
<!DOCTYPE html>
<html>
<head>
<script defer src="./js/canvas.js"></script>
<link rel="stylesheet" href="./css/canvas.css">
</head>
<body>
<canvas id="pinboard"></canvas>
</body>
</html>
In canvas.js I’ve written:
var canvas = document.getElementById("pinboard");
canvas.addEventListener("mousedown", function (e) {
console.log("DOWN 1 " + e);
});
canvas.onmousedown = function (e) {
console.log("DOWN 2 " + e);
}
This isn’t in a DOMContentLoaded listener, but I’ve tried with and without and it doesn’t work.
When I click on the canvas, I expect either “DOWN 1” to print, “DOWN 2” to print, or both, but neither of them are logging.
I’ve searched through quite a few posts but I can’t find anything that’s fixed my problem.