wow.js don't works correctly with position:relative

Asked Nov 16 '16 at 21:07

Active Nov 16 '16 at 21:07

Viewed 336 times

I'm building a website and I need some animations. My problem is that I have a block with the following CSS:

.description {
    position: relative;
    top: 100%;
    transform: translateY(-100%);
}

And the block is as follows:

<section id="first-section">
  <div class="description wow fadeInUp">
    <!-- Some other content here -->
  </div>
</section>

<section id="second-section">...</section>

But when I scroll down the .description block performs the animation in #second-section and then moves (with no animation) to the right place inside #first-section do I make myself clear?

.description needs to be positioned that way because of the design but I need to smooth the animation. Any idea why wow is having this issue with my block?

Thanks in advance for your answers.

asked Nov 16 '16 at 21:07

Alvaro Pedraza

1,176
6
20
44

do you get an error in the console? btw, you might need to provide more details as to why you are animating `.description` yourself (instead of letting the library do it for you) – blurfus Nov 16 '16 at 21:17
@ochi, I get `Uncaught ReferenceError: ytcfg is not defined` but it's a youtube error (I have a `` with an embed youtube video) – Alvaro Pedraza Nov 16 '16 at 21:19
for the sake of troubleshooting, remove it (for now) and see if something else shows up – blurfus Nov 16 '16 at 21:20
Error occurs in youtube-frame, so it can't case wrong animation behavior – br3t Nov 16 '16 at 21:23
I did it and works fine, but I need to position it in the bottom of the section, any idea? – Alvaro Pedraza Nov 16 '16 at 21:23
@AlvaroPedraza, can you provide jsfiddle example? – br3t Nov 16 '16 at 21:24

wow.js don't works correctly with position:relative

0 Answers0