如何在不使用可拖动事件的情况下将元素拖动到父容器中？

Question

我正在尝试将（el）div元素拖到虚线边框div中。我正在尝试为此工作的逻辑。

链接如下： https://jsfiddle.net/k8rt1yvx/7/

我已经尝试设置child.offsetY-parent-offsetY代码。

  

html代码（部分代码）

`<div class="subbox" ng-mousemove="mouse_move1($event)">
<div class="element" ng-mousemove="mouse_move2($event)">`

  

javascript（代码的一部分）

var mouse_x=0;
var mouse_y=0;
var el=document.getElementsByClassName('element');

$scope.mouse_move1=function(event)
{
   if(angular.element(event.target).hasClass('subbox'))
    {
       mouse_x=event.offsetX;
       mouse_y=event.offsetY;      
    }
};

$scope.mouse_move2=function(event)
 {
   if(event.buttons==1) //for left button click
     {
         var offset_x = event.offsetX;
         var offset_y = event.offsetY; 
         var drag_x   = mouse_x + offset_x;
         var drag_y   = mouse_y + offset_y;
         angular.element(el).css('top',drag_x+"px");
         angular.element(el).css('left',drag_y+"px");          
     }
 };

我不知道如何仅在子框div中使El Draggble可用。