CSS如何使元素淡入然后淡出？
通过使用以下CSS将其类更改为.elementToFadeInAndOut，可以使不透明度为零的元素淡入：
.elementToFadeInAndOut {
opacity: 1;
transition: opacity 2s linear;
}
有没有一种方法可以通过编辑同一类的CSS使元素淡入淡出？
问题答案：
使用CSS @keyframes
.elementToFadeInAndOut {
opacity: 1;
animation: fade 2s linear;
}
@keyframes fade {
0%,100% { opacity: 0 }
50% { opacity: 1 }
}
这是一个演示
.elementToFadeInAndOut {
width:200px;
height: 200px;
background: red;
-webkit-animation: fadeinout 4s linear forwards;
animation: fadeinout 4s linear forwards;
}
@-webkit-keyframes fadeinout {
0%,100% { opacity: 0; }
50% { opacity: 1; }
}
@keyframes fadeinout {
0%,100% { opacity: 0; }
50% { opacity: 1; }
}
<div class=elementToFadeInAndOut></div>
阅读：使用CSS动画
您可以通过执行以下操作清除代码：
.elementToFadeInAndOut {
width:200px;
height: 200px;
background: red;
-webkit-animation: fadeinout 4s linear forwards;
animation: fadeinout 4s linear forwards;
opacity: 0;
}
@-webkit-keyframes fadeinout {
50% { opacity: 1; }
}
@keyframes fadeinout {
50% { opacity: 1; }
}
<div class=elementToFadeInAndOut></div>
-
问题内容： 我有一个组件，单击时需要切换一个组件。这有效： 它使用条件显示或不显示组件。现在，我希望它逐渐消失。我尝试添加一个挂钩以过渡不透明度，但这不起作用。有没有简单的方法可以做到这一点？ 问题答案： 使用CSS类切换+不透明度转换的示例：https : //jsfiddle.net/e7zwhcbt/2/ 这是有趣的CSS： 和render函数：
-
问题内容： 我想让HTML div标签淡入淡出。 我有一些淡出的代码，但是当我淡入时，div的不透明度保持在0.1且不会增加。 我在做什么错，淡入淡出元素的最佳方法是什么？ 问题答案： 好，我已经解决了 应该代替 与相同 代替 因为不透明度值存储为字符串，而不是浮点数。我仍然不确定为什么添加成功了。
-
主要内容：实例,jQuery Fading 方法,jQuery fadeIn() 方法,实例,jQuery fadeOut() 方法,实例,jQuery fadeToggle() 方法,实例,jQuery fadeTo() 方法,实例通过 jQuery，您可以实现元素的淡入淡出效果。 因为时间是宝贵的，我们提供快捷方便的学习方法。 在小牛知识库,你可以学习需要的知识。 实例 jQuery fadeIn() 演示 jQuery fadeIn() 方法。 jQuery fadeOut() 演示 jQ
-
本文向大家介绍jQuery淡入淡出元素让其效果更为生动，包括了jQuery淡入淡出元素让其效果更为生动的使用技巧和注意事项，需要的朋友参考一下 为了达到更为生动的效果，可以把一个元素淡出或淡入，在任何一种情况下，都只是随着时间来改变元素的透明度。jQuery提供了3个和淡入淡出相关的函数： ·fadeIn()使得一个隐藏的元素淡入视野。首先，元素占据的空间出现在页面上(这可能意味着页面上的其他元素
-
问题内容： 如何使用jQuery淡入文本内容？ 关键是要引起用户对消息的注意。 问题答案： 确切的功能（3秒发光以突出显示一条消息）在jQuery UI中实现为突出显示效果 颜色和持续时间可变
-
问题内容： 我想淡入淡出带有UIBlurEffect的UIVisualEffectsView： 我在a调用的函数中使用普通动画来使其淡入，对于淡出也相同，但＆： 现在，在两个方向上褪色的工作，但衰落时，它给我一个错误 了 ： 被要求动画其不透明度。这将导致效果显示为残破，直到不透明度恢复到1。 题 如何成功地淡入和淡出而不 破坏 它并使其褪色？ 注意 我试图将其放进去并逐渐消失，但没有成功 问题答