更好的动画宽度解决方案

我在文本上有一个块,我想显示该文本并使块的宽度为零 我正在使用gsap,但据我所知,动画宽度效果不好, 由于我要大量使用此动画,因此我担心要为宽度设置动画

那么对于我的小问题有更好的解决方案吗?

gsap.to('.block', {
  duration: 1, width: 0, ease: Power4.easeIn}, 0.2);
h1 {
  position: relative;
  display: inline-block
}
.block {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: black;
  width: 100%;
  height: 100%;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"></script>
<h1>
  hello world
  <span class="block"></span>
</h1>
评论