通过使用j和jQuery的x和y属性拖动SVG

Question

是否可以通过使用SVG的x和y属性使SVG拖动？

是不使用jQuery拖动

$('#ninja').draggable({drag: function(event, ui) { 
    // $('#ninja').attr('x',ui.position.top+'%'); 
    // $('#ninja').attr('y',ui.position.left+'%'); 
} 
}); 

小提琴这里工作： http://jsfiddle.net/n4d7gq3z/

Answer 1

这是可能的，但是如果你看一个元素督察如Chrome开发者工具提供的一个，你会注意到你的svg声明前面的路径：

<path transform="translate(-29 -22) scale(2.2)" opacity="0.25" fill=" #fff" d="M210.018,10.505H45.983c-19.599,0-35.487,15.889-35.487,35.487v69.409 c36.33,14.751,76.046,22.896,117.67,22.896c42.263,0,82.558-8.395,119.336-23.576V46.66 C245.504,26.394,229.615,10.505,210.018,10.505z"/> 

优先于所有其他s，并覆盖所有其他svg元素和路径。如果您移除此路径或修改样式或结构以避免造成干扰，您的忍者svg可拖动事件将触发，然后您可以开始处理。