Sugarcube 2.31.1 question. I’m trying to create a passage transition effect where the screen fades to black on the outgoing passage, then fades in on the new passage. Like in the movies.
I have a solution… but only if there is no text on-screen: Two CSS animations first change the background color to black, and then from black to white. I then add a transition passage with a timed goto macro. So it runs like this:
Original Passage
Transition Passage - tagged with .fadetoblack and <<timed1s>><<goto "new passage">><</timed>>
New passage - tagged with .fadefromblack
It works great. Unless there’s text in the Original passage. Then, the text pops out when the Transition Passage loads, taking away from the nice fade effect. Ideally the text would fade with the background color change.
Is there a way to solve this?
For example, if the animation included a text colour change that matched the background color change, can I run the animation on the outgoing passage when the link is clicked, rather than when the new passage loads?
Something like the following should give you a fade-out completely then fade-in effect. You may have to tweak the timings and timing function to your liking, but it should serve as a base.