Sync restting all items on page after ajax

[CHEWX]

Hi,

When using ScrollReveal().sync(); on ajax callback, it seems to be resetting all items on the page, not the new items.

Cannot find any information on this.

Thanks

[CHEWX]

I've hacked a fix like this for now, but should be doing something similar as default.

afterReveal: (el) => $(el).removeAttr('data-sr')

[jlmakes]

Hey @CHEWX, thanks for the issue. I'm suspicious this may be a bug. Do me a favor, when you set options.cleanup to false does it work correctly?

[CHEWX]

Hi @jlmakes

I appreciate your replies!

I'm away at the moment, but happy to test on my return.

My current setup is the following to avoid any assumptions.

    scrollreveal : {

        init () {

            this.vars();

            this.setup();

        },

        vars () {

            this.sr = ScrollReveal();
            this.options = {
                delay: 250,
                distance: '50px',
                duration: 1250,
                easing: 'cubic-bezier(0.15, .35, 0, 1)',
                mobile: true,
                afterReveal: (el)  => $(el).removeAttr('data-sr')
            }

            if( Foundation.MediaQuery.atLeast('xlarge') ) {
                this.options.container = '.site-scroll';
            }

        },

        setup () {

            this.sr.reveal('[data-sr]', this.options);

        }

    },

[jlmakes]

No problem! I’ve recreated the bug on JSbin. Fixed in 4.0.3