JSFiddle - React, Tailwind, and code Playground

by kickerock

HTML

<div id="counter">
  0
</div>
<div id="hover-me">
  HOVER ME!!!
</div>

CSS

#hover-me {
  width: 300px;
  height: 300px;
  border: 2px solid red;
}

JavaScript

let counter = 0,
  isStopped = false;

$("#hover-me").mouseover(() => isStopped = true).mouseout(() => isStopped = false)
setInterval(function() {
  if (!isStopped) {
    counter++;
    $("#counter").html(counter);
  }

}, 1000);