缩放动画也翻译 gsap

Question

我有一个 svg，我希望其中四个元素弹出到位。我正在用 gsap 尝试这个，但它们看起来像是飞到位了。这是我用于此的代码

        gsap.fromTo(
            '#ide, #html, #handlebar, #search',
            1.5,
            {
                scale: 0,
            },
            {
                scale: 1,
                yoyo: true,
                ease: 'none',
                repeat: -1,
            }
        );

请同时查看codepen 以获取当前工作版本：https://codepen.io/prateekkarki/pen/oNxEZxo

我不想让他们从右边飞，我只是想让他们从原来的位置放大。如何在 GSAP 中实现这一点，请帮助。

Answer 1

只需删除影响转换的 CSS：

#ide, #html, #handlebar, #search {
  transform-origin: top center;
  transform-box: fill-box;
}

Demo.

仅供参考，您更有可能在the GSAP forums 上获得更快的回复。