michalsnik / aos

Animate on scroll library
MIT License
26.82k stars 2.6k forks source link

Activate animation only one time for all elements per page load #645

Open ska89abv opened 3 years ago

ska89abv commented 3 years ago

This is:

Expected Behavior

Hey is it possible to make the elements activate only 1 time when the page loaded? So animation will not play all the time you scroll up and down, but only the one first time you do it?

Slyness98 commented 3 years ago

From what I'm seeing documented (and I am just finding out about this repository), you should be able to set an attribute on your element to control this. Whatever element you are trying to animate once, set the attribute " data-aos-once='true' ". If you want ALL of your animated elements to only animate once, set your AOS.init({}) object with a property of "once: true".

ska89abv commented 3 years ago

Thank youuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu. It worked perfectly. AOS.init({once: true});

MohammadHosseinBagheri commented 3 years ago

Hi dear thank you, I use it in next.js and it works for me.

ankitdetroja commented 3 years ago

@Slyness98 Thanks dear It works. xD

britoga commented 2 years ago

Podem adicionar também o "once: true," dentro de "AOS.init({ });" vai resolver o problema Exemplo:

AOS.init({ once: true, });

Ahsan2001 commented 2 years ago

for duration and active one time

AOS.init({ once: true, duration: 1200, });

mtw404 commented 2 years ago

AOS.init({once: true}); its works thanks guys

alighauridev commented 2 years ago

it's working in react , thanks

Bijesky07 commented 2 years ago

Thank you guys it really helped me

anujrana78 commented 2 years ago

It worked for me thanks!

NaimurHera commented 1 year ago

Thanks

Rymenj commented 1 year ago

thank you for a once: true,

mehir19 commented 1 year ago

AOS.init({ once: true, });

arslanovngc commented 1 year ago

Good Afternoon. It's possible to use AOS only scrolling down? I need to disable AOS when user scrolling up

Rymenj commented 1 year ago

Good Afternoon. Yes, in react you have used once: true - useEffect(() => { AOS.init({ once: true, duration: 2000 }); }, []);

На пн, 3.04.2023 г. в 11:49 ч. Ismatillo @.***> написа:

Good Afternoon. It's possible to use AOS only scrolling down? I need to disable AOS when user scrolling up

— Reply to this email directly, view it on GitHub https://github.com/michalsnik/aos/issues/645#issuecomment-1493925332, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3LC3I6OJIU3TKV4JB2LB7TW7KFKNANCNFSM4UQTIDUA . You are receiving this because you commented.Message ID: @.***>

Sagar-in-CodingWorld commented 1 year ago

From what I'm seeing documented (and I am just finding out about this repository), you should be able to set an attribute on your element to control this. Whatever element you are trying to animate once, set the attribute " data-aos-once='true' ". If you want ALL of your animated elements to only animate once, set your AOS.init({}) object with a property of "once: true".

thank you very much for that... I am working on a react project ... under script tag inside header of index.html file I have written it --- AOS.init({once: true,}); And it is working...thanks all

adnanDevelop commented 1 month ago

It's work man