JSFiddle - React, Tailwind, and code Playground
HTML
<div id="info" style="width:100px; height:500px; position:absolute; right:0;"> </div>
<div id="myDiv" style="width:500px; height:500px;">Click me</div>
JavaScript
var myEvents = [];
var myDiv = document.getElementById("myDiv");
var infoDiv = document.getElementById("info");
function logEvent(e)
{
e.preventDefault(); // prevent default behaviour if needed
myEvents.push(e); // Store event info
}
myDiv.onmousemove = myDiv.onmousedown = myDiv.onmouseup = logEvent;
// Set a timer for looping through the events
gameTimer = setInterval(function() {
// Loop through events
while (myEvents.length>0)
{
ev = myEvents.shift();
// Display event info
infoDiv.innerHTML = ev.type + " " + infoDiv.innerHTML;
}
}, 100)