Mouse Position Observable

by gladtocode

HTML

<body>
  <div id="div">
    Values (move mouse):
  </div>
</body>

CSS

div {
  height: 500px;
}

JavaScript

const print = (value) => {
  const paragraph = document.createElement('p');
  paragraph.innerHTML = value;
  document.getElementById('div').appendChild(paragraph);
}

const mousePositionObservable = (callback) => {
  document.addEventListener('mousemove', (event) => {
    callback([event.x, event.y]);
  });
}

mousePositionObservable(print);