css 串行转换

Question

我现在浏览了一天多的网络，仍然找不到以下问题的有效解决方案。

1. 一个 div 应该从无到有从下向上增长到 100%
2. 文字应该淡入
3. 然后超时
4. 然后文本应该淡出
5. 然后 div 应该向 div 底部收缩并消失。

---

.max{
  max-height:100%;height:100%;color:#fff;
  -moz-transition-property:max-height,height, color;
  -moz-transition-duration:3s,3s,1s;
  -moz-transition-delay:0s,0s,2s;
 }
.min{
  max-height:0%;height:0%;color:transparent;
  -moz-transition-property:max-height,height, color;
  -moz-transition-duration:3s,3s,1s;
  -moz-transition-delay:1s,1s,0s;
 }

---

如何将 max 和 min 序列化为一个 CssClass 如果这是不可能的如何以另一种方式做到这一点。 但这不会飞。 有人对此有好的想法或经验吗？

Answer 1

只有在您的起始值和结束值不同时，才能进行转换。

因为你的开始值和结束值没有区别（'你一无所有，你一无所有'（总是看着生活的光明面））这是不可能的CSS 类。

也许你有两个类说appear和disappear，并在一段时间后使用javascript（setTimeout函数）在它们之间切换