Drag and move element (Flawed version)

by Sasabee

HTML

<body>
  <div class="box"></div>
</body>

CSS

body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100vh;
  background-color: #1B1C1E;
  overflow: hidden;
}
.box {
  background-color: #FDFF3A;
  width: 50px;
  height: 50px;
}

JavaScript

const el = document.querySelector('.box');
el.addEventListener('mousedown', (e)=>{
	el.style.position || (el.style.position = 'absolute');

	const mousemoveCallback = (e)=>{
		el.style.left = e.clientX + 'px';
		el.style.top = e.clientY + 'px';
	};

	const mouseupCallback = (e)=>{
		el.removeEventListener('mousemove', mousemoveCallback);
		el.removeEventListener('mouseup', mouseupCallback);
	};

	el.addEventListener('mousemove', mousemoveCallback);
	el.addEventListener('mouseup', mouseupCallback);
});