react中实现卡片堆叠效果的web动画

（1） 问题遇到的现象和发生背景
想要实现类似的动画功能：
卡片（放大）随着鼠标滑动从下往上移动，到达一定位置时候卡片缩小

找的几个动画库都没有想要的效果

（2） 我的解答思路和尝试过的方法
卡片随着鼠标滑动从下往上移动是用了react-gsap中的Timeline和Tween实现

（3） 我想要达到的结果
类似这个https://www.bogdalegends.com/
里面的卡片堆叠效果：

这个网址用的position:sticky定位+css3 scale3d来实现

使用 position:sticky 实现粘性布局 - ChokCoco - 博客园 如果问，CSS 中 position 属性的取值有几个？大部分人的回答是，大概是下面这几个吧？ 额，其实，我们还可以有这 3 个取值： 没了吗？偶然发现其实还有一个处于实验性的取值，position: https://www.cnblogs.com/coco1s/p/6402723.html

css scale3d,CSS3 三维空间缩放 scale3d()scalez()应用实例_weixin_39589766的博客-CSDN博客 CSS3新增了一系列制作动画的属性，其中有一个用于设置对象(如 div、ul li、文字等)大小缩放的属性scale。scale可在 X、Y 和 Z轴缩放，对应的属性分别为 scalex、scaley 和 scalez；同时设置在 X、Y 与 Z 轴的值就是对象在三维空间缩放。如果只要求对象在平面中缩放，使用scale属性即可；如果要求对象在三维空间中缩放，使用scale3d。在平面缩放的情况在前... https://blog.csdn.net/weixin_39589766/article/details/119401742