Questions tagged [wow.js]

WOW.js is a JavaScript plugin that reveals animations when you scroll. It is used in conjunction with Animate.css.

WOW.js

WOW.js is a JavaScript plugin that reveals animations when you scroll.

Usage

  1. Link to the CSS animation library

Link to (You can link to another CSS animation library by changing WOW.js settings)

<link rel="stylesheet" href="css/animate.css">
  1. Link and activate WOW.js
<script src="js/wow.min.js"></script>
<script>
    new WOW().init();
</script>
  1. Add rule in CSS to begin with hidden elements:
<style>
.wow {
    visibility: hidden;
}
</style>

Documentation

Source

139 questions
1
vote
1 answer

WOW.js does not support for chrome 68.0.3440.106

I used wow.js and animate.css in my project. I added wow attribute such as 'data-wow-delay="2s". However, it works in IE but not in Chrome Version 68.0.3440.106. Actually, the animation part works but wow-delay does not happen. Is this a bug in WOW?…
chk.buddi
  • 554
  • 1
  • 8
  • 29
1
vote
1 answer

Individual letter animation with Wow.js and Animate.css

I trying to achieve letter by letter animation with Wow.js and Animate.css. By default as I understand this can't be done. I found this great pen on codepen - https://codepen.io/aartiik/pen/jpjaxE The effect I'm for - 'BounceIn'. Unfortunately, I…
Arthur G
  • 25
  • 1
  • 9
1
vote
1 answer

ngx-wow not working angular 5

I've never used this library before Im hoping someone who has can help me out, Okay So I'm trying to use the ngx-wow library but I cant get it to work.. so following the instructions Ive run yarn add wowjs I added it to angular-cli.json "scripts":…
Smokey Dawson
  • 8,827
  • 19
  • 77
  • 152
1
vote
1 answer

Wowjs Event Trigger

I am trying to key off a wowjs event so I can apply my own styling when it is revealed. Does anyone know of something that does this or will I just have to key off a scroll event? Something like this would be great $('#someId…
Truextacy
  • 562
  • 1
  • 5
  • 26
1
vote
2 answers

wow.js and animate.css don't work anymore

I have a website with wow.js and animate.css effects. everything work fine here: http://doggystyle.businesscatalyst.com/ Then I made some changes and uploaded to another testing url, so the animation effects don't work now. check here:…
1
vote
1 answer

Wow.js delay doesn't work on click

I'm trying to make it so whenever I click on a certain element, other elements will appear using wow.js animations with a delay. The animation itself works on click, however, the delay isn't there. $(function() { …
1
vote
1 answer

How to insert html (data) attribute to Wordpress Divi theme module?

I am developing a website using Wordpress Divi Theme. I am using Animate.css and Wow.js for triggering custom animations when user scrolls the web page. In the module, Divi Advanced CSS section, there is a place which can enter custom classes. So, I…
LuckyBoy
  • 37
  • 1
  • 7
1
vote
1 answer

Issues with wow.js

so trying to using wow.js in conjunction with animate.css My animate css is working fine and wow.js has been included and activated but it isn't registering me scrolling down to the element so there for isn't animating. What I've included at the…
Sam
  • 47
  • 1
  • 2
  • 11
1
vote
3 answers

GatsbyJS/ReactJS & AOS(animate on scroll) causing build problems

This seems to be a common problem according to the creator of GatsbyJS. Here's a quote from a resolved issue on the GitHub repo: You have code (either your own or a module you're using) which is referencing the window object. This fails when server…
1
vote
0 answers

The text animation changes after the first slide. WOW.js library

I currently have a carrousel, in which there is a transition of several slides. I have an initial animation, which is perfect. As is the desired effect. Consists of the appearance of texts, which are executed one by one, according to the delay of…
yavg
  • 2,761
  • 7
  • 45
  • 115
1
vote
0 answers

wow.js not working with mCustomScrollbar

I have applied mCustomScrollbar to the body of my page which has wow.js I am forced to apply a height: 100% to the body of my my page and this stops wow working Is there any way around this?
Chris
  • 21
  • 2
1
vote
1 answer

Wow.js - Animation in a scrolling div with fixed height. Some objects disappear

I am using wow.js to fade in some divs which are under a div with overflow auto and fixed height. Some of the objects animate nicely but some of them would not animate or even appear (remain invisible). I presume this is a viewport issue. The…
Steven
  • 15
  • 4
1
vote
1 answer

slideindown wow from top

i try to reach the same animation like this link http://mynameismatthieu.com/WOW/index.html, the doge image come from way top to bottom how to get the animation like that. heres my code
antonscie
  • 149
  • 1
  • 11
1
vote
1 answer

Getting WOW.js and fullPage.js to work together when not using scrollbar?

So, I'm using the fullPage.js to create a one page style site. I decided I wanted to add some animations, however not having any knowledge of jQuery, I decided to opt for animate.css and WOW.js to go with it. As I understand, however, fullPage.js…
ZeddTT
  • 11
  • 3
1
vote
1 answer

Move (translate) css animation with wow.js and animate.css

I'm currently using wow.js and animate.css to intergrate CSS animations (bounceUp, fadeIn, etc.) though say if I wanted to use fadeIn then have the image translate to the right by 5em how would I do that?
Dylan
  • 15
  • 4