Greensock 在 3.9 版本 中免费提供了 GSAP Flip 插件。 FLIP 是一种动画概念,有助于实现超级性能的状态更改动画。 Ryan Mulligan 有一篇不错的博文
FLIP 由 Paul Lewis 创造,是 First(首)、Last(尾)、Invert(反转)和 Play(播放)的首字母缩写。 Flip 插件利用此技术,使 Web 开发人员能够轻松流畅地在状态之间转换元素。

使用 GSAP Flip 插件的示例
当然可以“手动”利用 FLIP,但很棘手。 这绝对是动画库可以为我们做的事情。 正如 Ryan 所说,Greenstock 做到了这一点。
1. 获取当前状态
2. 进行状态更改
3. 调用Flip.from(state, options)
非常简单。 Ryan 用它制作了一个“添加到购物车”效果。
前几天我用它制作了一个“迷你照片库”,可以旋转哪个图片在顶部是较大的图片。
巧合的是,这正是我前几天最终写博客 “如何在 HTML 元素上循环遍历类” 的原因。