search

usablica / kissui.scrollanim

CSS3 scroll animation library
http://scrollanim.kissui.io/
MIT License
1.42k stars 131 forks source link

Update animate 4.0 #21

Open PabloManuel78 opened 4 years ago

PabloManuel78 commented 4 years ago

Everything works perfectly with version 0.3.0. This version uses Animate.css version 3.5.1. I wanted to change to version 4.0.0 by removing this line:

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/kissui.scrollanim/0.3.0/scrollanim.min.css">

And replacing it with this:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css"/>

Everything seems to be going well, there are no errors and the elements appear and disappear. But the movement is not reproduced.

How can we upgrade to Animate 4.0.0?

PabloManuel78 commented 4 years ago

I see the problem is in the new class names. In version 4.0.0 they start with "animate__", just add this and the CSS library would be independent.

PabloManuel78 commented 4 years ago

Maybe with a little modification it would be worth:

element.element.className += ' animate__animated animate__' + element.event[e].animation;