CSS过渡并未在插入之后触发



我正在尝试创建一个循环的水平旋转木马。

您可以在此处检查代码:https://codepen.io/nobitta/pen/xnoyrj

目前我被卡住了。我设法使它起作用,但是当您单击"下一步"时,CSS过渡模仿了右侧的移动。

我已经进行了一些研究,有人说这与浏览器的优化有关,并且设置超时或调用offsetWidthgetBoundingRect()应该可以解决问题,因为它迫使浏览器重新渲染。但是,即使有这些提示,我也无法使其正常工作...

我在做错事还是在这里错过了什么?我应该怎么办?

预先感谢〜

我通过使用保证金左派属性进行了修复。

我的赌注是,当我预先预读了最后一个滑块的物品时,由于新元素的大小及其所占据的空间,它自然而然地移动了。因此,我决定将其换回以掩盖插入变化。我遵循了附加物品的相同原因。

您可以在问题中检查codepen。

我希望这对某人有帮助。

最新更新