search

jlmakes / scrollreveal

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

Working with intervals triggers all animations at once, instead of on scroll #358

Closed warrebuysse closed 7 years ago

warrebuysse commented 7 years ago 
sr.reveal('.product-tile', {
    scale: 1,
    duration: 900,
    distance: '30px',
    easing: 'ease-out',
}, 50);

When using the "interval" integer after the options all the animations on the page are triggered at the same time, so theres no "reveal on scroll" anymore. Without the interval it works fine, but the interval is exactly the effect i'm going for.

Pen to demonstrate: https://codepen.io/studiotwist/pen/RgxmEy

jlmakes commented 7 years ago

You’re not alone!

This has come up quite a few times (#339, #305 #297 #272 etc.) and in short, this is a known limitation of the sequencer. The good news is that this is the signature improvement made to ScrollReveal 4.0 which you can use today!

If you’d like, check out what's different in v4 and give the beta a try:

https://unpkg.com/scrollreveal@beta

It’s undergone 8 months of development (with 5 months in public beta), 98% backwards compatible, and it’s quite stable. Your feedback would be greatly appreciated, but if you prefer to wait, I expect the final release (and new website) will be out within a week or two.

(To be candid, there’s just one remaining bug before I drop the beta tag.)

warrebuysse commented 7 years ago

Alright, will jump on that train! Thanks!