2

我想使用 Velocity JSSVG group从中心旋转一个。transform-origin: 50% 50%;这在 Chrome 中运行良好，但我注意到转换原点在IE and Firefox. 我尝试设置一个额外的变换原点值，并尝试将变换原点设置为像素而不是 % 等，但没有运气。谁能解释如何解决这个问题？

我在这里有一个演示http://codepen.io/styler/pen/wBRPEa?editors=101

代码片段

CSS

.box {
  transform-origin: 50% 50%;
}

JS

var box = document.querySelector('.js-box');    
setInterval(function() {
  Velocity(box,
    {
      rotateZ: 0
    },
    {
      duration: 600
    },
    "easeIn"
  );
  Velocity(box,
    {
      rotateZ: 360
    },
    {
      duration: 1200
    },
    "easeOut"
  );
}, 2200);

我试过旋转一个平原div，正确的变换原点工作正常，似乎与 SVG 相关。

4

0 回答 0