Draggabilly - CIRCLES

Dragging issue using Draggabilly.js with SVG elements under Internet Explorer.

by hanna314

HTML

<script src="http://draggabilly.desandro.com/draggabilly.pkgd.js"></script>
<svg>
    <circle xmlns="http://www.w3.org/2000/svg" fill="#202020" cx="50%" cy="50%" r="16"></circle>
    <circle xmlns="http://www.w3.org/2000/svg" fill="#" cx="50%" cy="50%" r="16"></circle>
</svg>
<div id="circle"></div>

CSS

html, body {
    width : 100% ;
    height : 100% ;
    overflow : hidden ;
    background : #404040 ;
}

#circle {
    position : absolute ;
    top : calc(50% - 8px) ;
    left : calc(50% - 64px) ;
    width : 32px ;
    height : 32px ;
    background : gray ;
    border-radius : 32px ;
}

JavaScript

new Draggabilly(document.querySelector('svg')) ;
new Draggabilly(document.querySelector('#circle')) ;