[Harlowe 1.2.4] CSS animations playing twice on load

Question

Ok, so first of all, this started because of another problem - as soon as the text is wrapped in some sort of element, div, p, whatever, it stops fading it neatly at the start. I tried googling it but haven't found a solution that would work for me. So I decided to just use a simple fade-in animation on all elements, except I can't stop it from playing twice...

Neither the (transition: "dissolve") method nor CSS animations work properly - I checked both on Chrome and Firefox. The same CSS animation works just fine when tested in a different webdev environment.

This is really making me tired...

the code I'm using currently:

* {
	-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}

@-webkit-keyframes fadein {
	from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes fadein {
  	from { opacity: 0; }
    to   { opacity: 1; }
}

 

Answer 1

I'm not the best at CSS. You could try checking the old forums. I'm sorry no one else has answered your question, but I really don't know how to help. I'll give you a vote so hopefully more people will answer

Answer 2

Both of your issues, the element rendering timing issue and the potential double activation of animation effect issue, are caused by the method Harlowe uses to handle the transition from one Passage to another.

After the HTML content of the next Passage has been generated it is wrapped within a classed tw-transition-container element and then briefly attached to the current web-page's DOM so that that HTML structure can be rendered, this structure is then removed and replaced with the HTML content of the next Passage without the tw-transition-container element. This subject matter is (lightly) covered in the following two posts on the old forums.

Harlowe 2.0.0 Fade In Transition Help!
Progress Bar Resets in Harlowe