This question was originally asked back in 2012但是答案提供的内容并不包括我感兴趣的用例(包装内容更改行的平稳移动)。
“当我从Flexbox中删除某个项目时,其余项目会”快速“进入 他们的新职位立即而不是动画。
从概念上讲,由于物品正在改变其位置,我愿意 期望过渡适用。
我已经在所有涉及的元素上设置了过渡属性( flexbox和孩子们)
有没有办法动画编辑(添加和删除)到flexbox?“
我特别感兴趣的是设置包装到其他行/列的flexbox项目的动画。
所需的最终功能类似于可用的in metafizzy's isotope.
答案 0 :(得分:1)
我能做到,而且它很狡猾 https://codepen.io/balvin/pen/wXGyYw
没有包装,它更容易https://codepen.io/balvin/pen/gKrXdM
基本上您需要将所有弹性项目设置为width:0;flex-grow:1
但是当你想要它与wrap一起工作时,它变得有点困难,因为这些项目需要width
以便能够包装它们,所以使用一些setTimeout我可以完成它
答案 1 :(得分:0)
简短回答是否定的(或至少尚未定义)。灵活顺序实际上是可动画的,因为在给定的时间范围内,它会在你想要的位置之间一次一个位置,但你不会得到平滑的元素转换。