Fadeout issue (Sugarcube 2.11.0)

Jud_Casper

I'm using the following to fade out text, in order to simulate death/gameover.

The problem I have is that once the text has faded away, it pops back up again and remains on the screen.

How would I adapt this so that once the text has faded away, it remains gone?

body.gameover .passage {-webkit-animation: fadeout 10s;
       -moz-animation: fadeout 10s;
        -ms-animation: fadeout 10s;
         -o-animation: fadeout 10s;
            animation: fadeout 10s; width: 500px; margin: 250px 0 0 50px; }
@keyframes fadeout  {from {opacity: 1;} to {opacity: 0;}}

Thanks in advance.

klembot

Take a look at the animation-fill-mode CSS property.

Jud_Casper

Thanks, klembot. So I just add forwards after each of the 10s.

I'd also discovered another way and was just about to clarify. A simple opacity: 0; before the closing } on the first selector also does the job.

Thanks again.