javascript - 在添加特定于过渡的 css 属性之前所做的更改会触发过渡。为什么？

Question

看看这个jsfiddle http://jsfiddle.net/zB2Td/5/

尽管在更改尺寸后添加了 .animate 类，但仍会触发动画。如果您取消注释，结束转换的第二行将不会按预期开始。为什么这段代码会这样工作？添加 .animate 并且不触发先前更改的转换的正确方法是什么。谢谢!

Answer 1

据我了解，正在发生的事情是对 box.width() 的调用算作“读取”操作，如 this post 所定义的那样。 .它强制浏览器(无论如何是 webkit)重新布局(又名回流)DOM。如果没有这个调用，浏览器永远不会“知道”在添加 .animate 之前盒子是 200x200，并且它假设盒子开始时是 100x100。