加载页面后正确的动画方法？

Question

我想在页面加载后设置外观动画。 问题是，在加载 CSS 之前，元素突然到达，最后，一旦我加载了所有内容，我的动画就会启动。视觉上不是很酷。

我想出的解决方案是容器上的默认不透明度！不确定，问题是如果浏览器不支持动画，用户将看到不透明度为0 的站点。也就是说，他什么也看不见。

那么有没有办法做到这一点？

PS：我尝试在 Google 上进行了很多搜索，但始终没有找到我的问题的答案，也许我没有使用正确的术语。

Answer 1

牢记浏览器兼容性非常重要。但是，您可以通过 CSS 动画实现您想要的结果，而且压力很小：https://caniuse.com/#feat=css-animation。

如果您提供一些 HTML 和 CSS，则可以提供更具体的答案。但是，我建议为您想要制作动画的每个元素定义关键帧（如果需要，可以使用相同的元素）并在站点加载时将其用于一次性动画。不需要 JS。