Search code examples
angularanimate-on-scroll

AOS - how to not hiding the element again on scroll up

I'm using aos library in my angular project, and I attach it to the element

<div data-aos="zoom-in"></div

it works fine, but my problem is, that when I scroll up - the element disappears, and scrolling down - appears again.

I assume this is the default behavior of AOS, so my question is - how can I change it? so when scrolling wherever after the element appears- it would stay there staticly and won't disappear.

Thanks you for every answer.

Solution

  • You can use the property data-aos-once="true" as below to avoid the element disappearing when scrolling up.

    <div data-aos="zoom-in" data-aos-once="true"></div>

    Note: By using data-aos-once="true", An AOS effect will only work once.