javascript - 动画引导卡替换消失的引导卡

Question

想象一个使用引导卡的网站。

现在，如果你点击一个按钮，让上面的一些卡片消失，下面的卡片会神奇地在眨眼间填补最近消失的卡片的位置。消失的卡片下面的卡片如何顺利过渡并取而代之？

注意：我正在寻找的答案只需要解决我的问题 - 我不在乎如何。

---

我尝试了以下方法：

#projects.card { //expect that each card have been supplied with the class name 'card'
    -moz-transition: 2s;
    -ms-transition: 2s;
    -o-transition: 2s;
    -webkit-transition: 2s;
    transition: 2s;
}

---

展示未发生过渡 的 GIF：单击此处查看 GIF

标签： javascripthtmlcsstwitter-bootstrapsass

Answer 1

非常高级的想法是拥有记忆中的所有位置，并根据这些位置和位置变化自己处理所有运动。

但您可以使用预建库，例如https://vestride.github.io/Shuffle/