Javascript 动画结束后实体在实体上的行为

我有个问题。我在身体上做了一个

CSS

动画，从一种颜色切换到另一种颜色大约10秒钟，只显示一个图像和一个

段落

，忽略了其余的

段落

和其他用我的

HTML

代码编写的东西

动画完成后，我希望主体显示实际的

HTML

内容（其他

段落

和

DIV

等）。现在这就是问题所在，我尝试了不透明度，并在动画期间将其设置为0，然后在动画结束后将其重置为1，但我无法做到？你能帮我吗？我在

JS

中使用事件侦听器和

CSS

中的关键帧创建了动画

let backColor=document.querySelector（'body'）；
让banner=document.querySelector（“#banner p”）；
设img=document.querySelector（“#banner img”）；
函数myMove（）{
backColor.style.WebkitAnimation='mymove 7s 1s 1向前'；
backColor.style.animation='mymove 7s 1s 1 forwards'；
}
backColor.addEventListener（'animationstart'，（）=>{
this.style.backgroundColor='白色'；
});
backColor.addEventListener（'animationend'，（）=>{
this.style.backgroundColor='black'；
});
myMove（）；
函数yourMove（）{
banner.style.WebkitAnimation='yourmove 6s 4s 1'；
banner.style.animation='yourmove 6s 4s 1'；
}
banner.addEventListener（'animationstart'，（）=>{
this.style.opacity=0；
});
banner.addEventListener（'animationend'，（）=>{
this.style.opacity=1；
});
yourMove（）；
函数hisMove（）{
img.style.WebkitAnimation='hismove 3s 6s 1'；
img.style.animation='hismove 3s 6s 1'；
}
img.addEventListener（'animationstart'，（）=>{
this.style.opacity=0；
});
img.addEventListener（'animationend'，（）=>{
this.style.opacity=1；
});
他的举动（）
正文{
保证金：0；
填充：0；
}
@关键帧mymove{
从{
背景色：白色；
}
到{
背景色：黑色；
}
}
#横幅p{
颜色：白色；
字体大小：25px；
字体系列：格鲁吉亚；
不透明度：0；
文本对齐：居中；
}
img{
位置：相对位置；
左：35%；
不透明度：0；
}
@移动关键帧{
0% {
不透明度：0；
}
50% {
不透明度：1；
}
100% {
不透明度：0；
}
}
@关键帧移动{
0% {
不透明度：0；
}
50% {
不透明度：1；
}
100% {
不透明度：0；
}
}

在科比·布莱恩特的爱的记忆中（1978-2020）

本不需要这样做，但它是固定的：


let backColor=document.querySelector（'body'）；
让banner=document.querySelector（“#banner p”）；
设img=document.querySelector（“#banner img”）；
函数myMove（）{
backColor.style.WebkitAnimation='mymove 7s 1s 1向前'；
backColor.style.animation='mymove 7s 1s 1 forwards'；
}
backColor.addEventListener（'animationstart'，（）=>{
backColor.style.backgroundColor='白色'；
});
backColor.addEventListener（'animationend'，（）=>{
backColor.style.backgroundColor='黑色'；
});
myMove（）；
函数yourMove（）{
banner.style.WebkitAnimation='yourmove 6s 4s 1'；
banner.style.animation='yourmove 6s 4s 1'；
}
banner.addEventListener（'animationstart'，（）=>{
banner.style.opacity=0；
});
banner.addEventListener（'animationend'，（）=>{
banner.style.opacity=1；
});
yourMove（）；
函数hisMove（）{
img.style.WebkitAnimation='hismove 3s 6s 1'；
img.style.animation='hismove 3s 6s 1'；
}
img.addEventListener（'animationstart'，（）=>{
img.style.opacity=0；
});
img.addEventListener（'animationend'，（）=>{
img.style.opacity=1；
});
他的举动（）
正文{
保证金：0；
填充：0；
颜色：白色；
}
@关键帧mymove{
从{
背景色：白色；
}
到{
背景色：黑色；
}
}
#横幅p{
颜色：白色；
字体大小：25px；
字体系列：格鲁吉亚；
不透明度：0；
文本对齐：居中；
}
img{
位置：相对位置；
左：35%；
不透明度：0；
}
@移动关键帧{
0% {
不透明度：0；
}
50% {
不透明度：1；
}
100% {
不透明度：0；
}
}
@关键帧移动{
0% {
不透明度：0；
}
50% {
不透明度：1；
}
100% {
不透明度：0；
}
}

在科比·布莱恩特的爱的记忆中（1978-2020）

撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯撕扯
@gforce301这是密码，但我希望在动画完成修改后，身体的背景变成白色。这一点必须加以调整，你会明白：再增加一个关键帧