javascript - TweenMax 尝试在文本字段上一次为一个字符设置动画

Question

这是我的html代码:

   <h1 id="designs">
      <span>D</span>
      <span>e</span>
      <span>s</span>
      <span>i</span>
      <span>g</span>
      <span>n</span>
      <span>s</span>
   </h1>

我正在尝试补间每个字母以像这样旋转:

TweenMax.staggerFromTo($map.designs.find('span'), 1, {
    rotationY: 180
}, {
    rotationY: 0
}, 0.1);

这是行不通的!虽然做的是完全相同的事情，但是修改了顶部/左侧/右侧/底部/不透明度/等等。值有效。

请告诉我为什么我不能修改 3d 值!

Answer 1

我修改后的版本有效，我已经包含了一个 jsfiddle 供您检查，我还添加了以下 css，Chrome 似乎需要它，至少在 jsfiddle 中是这样。

span { display: inline-block; }

TweenMax.staggerFromTo($('#designs').children(), 5, {
    rotationY: 180
}, {
    rotationY: 0
}, 0.1);

查看此 fiddle 以显示其正常工作:

http://jsfiddle.net/SERT5/2/