左侧位置但不是宽度的css转换setTimeout

Question

我向 DOM 添加了一个元素，其左侧位置离开屏幕，然后立即将左侧位置设置为在屏幕上，以便它可以执行过渡动画，但如果没有 setTimeOut 函数，这似乎不起作用。 但奇怪的是，当我做同样的事情但元素的宽度首先为 0px，然后在我不需要 SetTimeOut 之后直接将其设置为全宽。

谁能解释这是为什么？

Answer 1

这取决于元素是否已经渲染。设置后立即更改位置值可能不会使其进入渲染序列。如果你想要 CSS 动画发生，你必须给它一些时间来渲染它，然后才能改变它。这就是为什么你需要使用setTimeout。

不过，我不确定为什么这对元素大小有效。查看代码可能会有所帮助。