jlmakes / scrollreveal

Animate elements as they scroll into view.
https://scrollrevealjs.org/
22.39k stars 2.26k forks source link

ScrollReview viewFactor only works from bottom to top of the page. #443

Closed jovvybersamin closed 6 years ago

jovvybersamin commented 6 years ago

Here is my implementation.

window.sr = ScrollReveal({ reset: true });

sr.reveal('.services-title', {
    duration: 2000,
    origin: 'top',
    viewFactor: 0.2
});

sr.reveal('.mission-vision-title', {
    duration: 2000,
    origin: 'top',
    viewFactor: 0.2
});

Anyone knows why?

jlmakes commented 6 years ago

Nothing suspicious stands out about the JavaScript you shared. I'm not sure how to help with more information about your project. Better yet, can you demonstrate the problem?

Also, for what it's worth, here's a demo of correct options.viewFactor behavior using ScrollReveal 3.

GarryKnimble commented 6 years ago

If you haven't already, one thing you could try is in your css is doing html, body { height: 100%; } Solution from here: https://github.com/jlmakes/scrollreveal/issues/182

jovvybersamin commented 6 years ago

@JohnPhilosopher thanks mate, I'll try that.

jovvybersamin commented 6 years ago

html, body { height: 100%; }

This fixes the issue.