[Dilettante_Pro]

Хотя и с одинаковым id все равно работает (т.к. он не используется в коде?)

<style>
.mdiv {
   width:20px;
   height:20px;
   border:1px solid black;
   border-radius:50%;
}
</style>
<div class="svg_div_block">
	<div id="ball" class="dragable_div">
	  <div id="svg_source" class="mdiv">
          <object id="svg_source" type="image/gif" data="https://javascript.ru/forum/images/smilies/smile.gif"> </object>
            </div>
	</div>
</div>
<script>
var dragObject = null;
	
	var ball = document.getElementById('ball');

	function moveAt(e) {
		dragObject.style.left = e.pageX - dragObject.offsetWidth / 2 + 'px';
		dragObject.style.top = e.pageY - dragObject.offsetHeight / 2 + 'px';
	}
		
	document.onmousemove = function(e) {
		if (dragObject !== null)	moveAt(e);
		document.activeElement = dragObject;
		return false;
	}
		
	document.onmouseup = function(e) {
		alert("UP");
		if (dragObject !== null) alert("UP");
	}
	
	ball.onmousedown = function(e) { // 1. отследить нажатие
	    if (e.which != 1) return false;//только левой кнопки мыши
		dragObject = this;
		dragObject.style.position = 'absolute';//подготовить к перемещению 2. разместить на том же месте, но в абсолютных координатах
		document.body.appendChild(dragObject);// переместим в body, чтобы мяч был точно не внутри position:relative
		dragObject.style.zIndex = 1000; // показывать мяч над другими элементами
		return false;
	}

	// 4. отследить окончание переноса
	ball.onmouseup = function(e) {
		alert("UP");
		document.onmousemove = null;
		ball.onmouseup = null;
		dragObject = null;
        }
</script>