css - 在最后一帧停止 CSS 淡入淡出动画幻灯片
问题描述
我正在为背景图像制作 CSS 动画淡入淡出效果。动画正常进行,但又回到了第一帧。有没有办法在最后一帧之后停止它?
**
#slideshow {
list-style: none;
margin: 0;
padding: 0;
position: relative;
width:100%;
height:100%;
display: inline-block;
}
.elemnt,.elemnt1,.elemnt2,.elemnt3 {
position: absolute;
left: 0;
width: 100%;
background-repeat: no-repeat;
background-size: cover;
height: 100%;
display: inline-block;
text-align: center;
}
.elemnt {
animation: xfade 50s 4s ;
background-image: url('flip_data/2w.png');
}
.elemnt1 {
animation: xfade 50s 3s;
background-image: url('flip_data/2f2.png');
}
.elemnt2 {
animation: xfade 50s 2s;
background-image: url('flip_data/2f1.png');
}
.elemnt3 {
animation: xfade 50s 0s;
animation-fill-mode: forwards;
background-image: url('flip_data/page_finale_web_flip.png');**
解决方案
这就是你需要的:
animation-fill-mode: forwards;
推荐阅读
- javascript - Moving an image Javascript
- javascript - 如何制作一个循环打印出第一个字母,然后在新行上打印两个,等等 - javascript
- python-3.x - 使用预训练的 gensim Word2vec 嵌入以及 keras 中的数据集
- azure - Azure APIM 定价层和虚拟网络
- c++ - 在这个有效的斐波那契函数中,它不是传递可以存储在数组中的元素数量吗?
- android - Android SQLite - Update table 1 based on changes in table 2
- java - Parsing JSON File using Gson
- ios - 如果输入为空,如何按 ALL 过滤?SwiftUI/核心数据
- powerbi - 如何在 Power BI 嵌入式代码中实现安全性?
- c++ - Qt StyleSheet to programmatically createdQWidget