快速svg拖动：IE 10和11中的意外行为

Question

https://codepen.io/willdelphia/pen/KeePgv

我正在尝试使用snap SVG制作一个可用作值滑块的lil小部件。

它在Adobe Illustrator生成的某些内嵌svg元素上使用了snap的蒙版和拖动功能。

问题是，尽管它似乎可以在chrome，firefox，safari和edge中正常工作。 IE 10和11给我奇怪的结果。

应该看起来像这样：

在IE 10和11中，拖动工作正常，但是应该同时更新其翻译的蒙版也不会立即更新....奇怪的是，如果我等待一两秒钟，然后单击页面a两次将蒙版确实更新到其正确位置。烦死了。

我不确定导致这种情况的原因。有人在IE中使用Snap SVG有经验吗？

不幸的是，我需要能够支持Internet Explorer10。

这是我在Codepen中的JS代码：https://codepen.io/willdelphia/pen/KeePgv

var s = Snap("#wiggleslider");
progress = s.select('#progress');
progress.attr({ x: 0, y: 0})
mask = s.select('#mask');

progress.attr({ mask: mask});
progress.transform('t-500');
mask.transform('t500');


progress.animate({
  transform: 't-450'
},1000, mina.elastic);

mask.animate({
  transform: 't450'
},1000, mina.elastic)


 var max = 0;
 var min = -450;
 range = max-min;


 var move = function(dx,dy) { 

  var ox = this.data('origTransform').split(/[tT,]/)[1] || 0;

  rightSpace = max - ox;
  leftSpace = min - ox;

  var absoluteTransform = dx + (ox ? parseFloat(ox) : 0);

  if(dx < rightSpace && dx > leftSpace) {
       this.attr({
        transform: this.data('origTransform') + "t" + [dx, 0]
            });
  mask.attr({
        transform: mask.data('origTransform') + "t" + [-1*dx, 0]
            });

   }
   else if (dx > rightSpace) {
      this.attr({
        transform: this.data('origTransform') + "t" + [rightSpace, 0]
            });
    mask.attr({
        transform: mask.data('origTransform') + "t" + [-1*rightSpace, 0]
            });
   }
    else if (dx < leftSpace) {
      this.attr({
        transform: this.data('origTransform') + "t" + [leftSpace, 0]
            });
    mask.attr({
        transform: mask.data('origTransform') + "t" + [-1*leftSpace, 0]
            });
   }

   var finalx = this.transform().local.split(/[tT,]/)[1] || 0;
   var value = 1 - (finalx / range * -1);
   document.querySelector('.percent').innerHTML = value.toFixed(3);

}

var start = function() {
  console.log(this.transform());
   this.data('origTransform', this.transform().local );
   mask.data('origTransform', mask.transform().local );
}
var stop = function() {
  console.log('finished dragging');
}

progress.drag(move, start, stop);