我有一个 div 元素，它充当我的网页的全局容器，我在其中也有一个 div 元素，我将其用作窗帘，即当它被激活时，它会在黑暗的半透明层中覆盖整个页面（就像灯箱一样） ），因此该页面基本上已停用，并且可以在顶部显示警告对话框或图片框等。
我可以使用javascript轻松实现这种效果和功能，但我想知道是否可以纯粹使用css动画来实现？
<div id='globalCon'>
<div id='curtain' class='enabled'></div>
<div id='contentA'></div>
<div id='contentB'></div>
...
</div>
因此，当窗帘未激活时，它的不透明度应为 0，最好是display:none;以免妨碍。然后当它被激活时它应该有display:block并将不透明度动画设置为 0.8。然后，当它被停用时，不透明度应动画回到 0，然后应设置回display:none;
就像我说的，我可以使用 javascript 轻松完成此操作，我只是想知道是否以及如何仅使用 css 来完成此操作？
您可以使用：
动画填充模式：无/向后/向前/两者；
“animation-fill-mode”属性定义了应用的值
动画在执行时间之外
来自Spec. http://dev.w3.org/csswg/css3-animations/#animation-fill-mode-property
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
