为什么滑块仅适用于两个幻灯片？

Question

我正在尝试制作带有倾斜幻灯片的滑块。
Link to codepen

在滚动时，我向每张幻灯片添加active类，但只有两张幻灯片-实际上显示了3张和4张，没有显示1张和2张。
如果滚动，实际上可以看到2张幻灯片中的图像短暂显示在左侧顶部。
据我所知，每张幻灯片都按预期添加了类。
如果我注释掉3和4，则它与1和2的工作方式相同。

我不确定问题是否可能在CSS样式中？所有帮助将不胜感激。

Answer 1

您的状态倒退了。当幻灯片处于“活动状态”时，实际上将其移出屏幕。因此，所有不活动的幻灯片都堆叠在视图中，只允许您看到数字4。除非数字4是活动幻灯片，否则这种情况下幻灯片3会显示出来。

在默认状态和活动状态之间切换transforms。