该代码使站点的背景图像在 5 个不同的图像之间转换,但每次动画完成且下一个动画开始时,都会出现白色闪光。我该如何摆脱它或我做错了什么?我不知道如何以任何其他方式解释它。
@keyframes backswitch {
0% {
background-image: url("background.jpg");
}
20% {
background-image: url("background_2.jpg");
}
40% {
background-image: url("background_3.jpg");
}
60% {
background-image: url("background_4.jpg");
}
80% {
background-image: url("background_5.jpg");
}
100% {
background-image: url("background_6.jpg");
}
}
body {
/*Adjusting images and animation*/
background-repeat: no-repeat;
max-width: 100%;
max-height: 100%;
background-size: cover;
animation-name: backswitch;
animation-duration: 60s;
animation-iteration-count: infinite;
}Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html>
<body>
</body>
</html>Run Code Online (Sandbox Code Playgroud)