css - 有没有办法在不依赖 JavaScript 的情况下让这个 CSS 动画不那么笨重？

Question

所以，我试图根据他们的类（通过从顶部菜单中选择一个类别来改变）来让这个页面上的图像块出现/消失和增长/缩小。动画的工作方式目前有大部分想法，但似乎有很多笨拙 - 特别是从“显示全部”屏幕到任何瓷砖较少的部分。

除了根据显示/隐藏的图块附加 CSS 类之外，我想避免对任何动画使用 javascript。

有没有办法实际制作变换的外观：scale(); 与移动瓷砖而不是诉诸于使用改变瓷砖的高度/宽度来使它们从顶部/左侧调整大小？

动画的演示版可在此处获得：https ://wolfandthunder.com/demo/israel_arias/v2/

标签： csscss-animations