Jquery 如何创建具有可变定位和z索引的滑动团队部分？

在Wordpress中，我试图创建一个团队部分，模拟CapitalG在其网站上的内容。我正在考虑使用jQuery来实现这一点，并动态设置z索引，这样我就可以将鼠标悬停在每个团队成员的上方，让他们的姓名和头衔显示在每个成员的下方

例如Capital G的团队页面：

下面是他们目前正在做的事情的图像：

每个图像当前都是一个透明的.png文件

我尝试过动态设置z索引，并在每个成员上添加CSS悬停功能作为参数，但在正确定位和重叠图像时遇到了困难

---

我希望它的输出看起来像CapitalLG的团队滑块，但实际输出目前看起来像是相邻的图像。我必须使用绝对定位吗？

请在此处添加有意义的代码和问题描述。不要只是链接到需要修复的站点——否则，一旦问题解决或者你链接到的站点无法访问，这个问题将对未来的访问者失去任何价值。发布一个能证明你的问题的帖子会帮助你得到更好的答案。有关更多信息，请参阅“谢谢！”！zIndex用于使HTML元素堆叠在彼此之上。HTML和CSS内置了一个基本而简单的滑块机制。zIndex功能非常适合弹出窗口。。。我还没有看过capitalG背后的代码，但我会的。我现在在手机上，看不到CapitalG的页面来源，但它看起来就像一个HTML分隔符，图像相邻。注1:png图像格式允许图像的“清晰”或“半透明”部分——正如你所见，这些人的照片的白色背景部分永远不会覆盖他们的前肢。注2：当照片中的一个人居中时，他们似乎“退到一边”。这意味着JavaScript可以左右移动单个照片。注3:zIndex非常好用，保持简单。