search

graingert / WOW

Reveal CSS animation as you scroll down a page
https://wowjs.uk
Other
1.58k stars 1.56k forks source link

Can not run in Animate.css (V4.1.1) #40

Open WildDagger opened 3 years ago

WildDagger commented 3 years ago

I try to use wow.js with animate.css, how ever, it not works when I use CDN Link from official site of animate.css. But when I use old version, it works.

konstantin-lysenko commented 3 years ago

@WildDagger You should use a case like that:


import WOW from "wow.js";

var wow = new WOW({
    boxClass:     'wow',
    animateClass: 'animate__animated',
    offset:       200,
    mobile:       true,
    live:         true
})
wow.init();`
fourroses666 commented 3 years ago

Same problem: Works: (animate 3.7) https://jsfiddle.net/fourroses666/1t2x9hua/1/ Doesn't work: (animate 4.1.1) https://jsfiddle.net/fourroses666/1t2x9hua/3/

AnatoliiMikhov commented 3 years ago

https://animate.style/#migration

vsuta commented 3 years ago

Work: (animate 4.1.1) Just add prefix "animate" so yur full class look like this: "wow animateslideInLeft" (two uderscores)

Hey!

this is correct. var wow = new WOW({ boxClass: 'wow', animateClass: 'animate__animated', offset: 200, mobile: true, live: true }) wow.init();

RoneoOrg commented 1 year ago

To install and use it without CDN and without animate__ prefix:

Get the files

Load

<link rel="stylesheet" href="/css/animate.compat.css">

<script src="/js/wow.js"></script>
<script>
  new WOW().init();
</script>

Use

<img class="wow flash" src="/img/cloud.jpg" alt="Blue sky and clouds">