Text verschwindet nach CSS-Animation?CSS

CSS verstehen
Anonymous
 Text verschwindet nach CSS-Animation?

Post by Anonymous »

Ich versuche, eine Animation einzurichten, bei der ein Titel zuerst verblasst und nach einer Verzögerung der Untertitel verblasst. Der Titel funktioniert gut, aber sobald der Untertitel darin verblasst, verschwindet vollständig. Die beste Antwort, die ich gefunden habe, ist, Animtion-Fill-Mode hinzuzufügen: Forwards; , aber das habe ich bereits getan. Wie kann ich dies beheben, damit der Text bleibt, nachdem ich verblassen kann?

Code: Select all

.fade-in-text-sub {
font-size: 50px;
vertical-align: middle;
color: #c1c3d9;
opacity: 0;
animation: fadeIn linear 3s;
animation-fill-mode: forwards;
-webkit-animation: fadeIn linear 3s;
-moz-animation: fadeIn linear 3s;
-o-animation: fadeIn linear 3s;
-ms-animation: fadeIn linear 3s;
animation-delay: 1s;
}

@keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-moz-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-o-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-ms-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post