如何从覆盖div中拉出一个项目？

<div id="overlay" style="position: absolute; top: 100px; left: 100px; width: 200px; height: 200px; background-color: rgba(0, 0, 0, 0.5);"></div>
<div id="project" style="position: relative; width: 100px; height: 100px; background-color: #ff0000;"></div>

var overlay = document.getElementById('overlay');
var project = document.getElementById('project');

var isDragging = false;
var initialX, initialY;

overlay.addEventListener('mousedown', function(event) {
  isDragging = true;
  initialX = event.clientX - project.offsetLeft;
  initialY = event.clientY - project.offsetTop;
});

document.addEventListener('mousemove', function(event) {
  if (isDragging) {
    var newX = event.clientX - initialX;
    var newY = event.clientY - initialY;
    project.style.left = newX + 'px';
    project.style.top = newY + 'px';
  }
});

document.addEventListener('mouseup', function() {
  isDragging = false;
});