michalsnik / aos

Animate on scroll library
MIT License
26.8k stars 2.59k forks source link

anchorPlacement does not work as expected. #514

Open AnkitSharmaOnGithub opened 5 years ago

AnkitSharmaOnGithub commented 5 years ago

anchor placement does not work as expected.

When I am trying to use anchorPlacement with any value like 'bottom-bottom','center-bottom'. I see no effect. The div just shows up as soon as the previous div goes off the screen. I tried searching it everywhere StackOverflow, CSS-tricks, Github issues. But I cannot get any solution.

I also suggest updating the readme as It is not that much information about the "trigger-position" and "anchorPlacement"

Here is a link depicting my issue:-

https://jsfiddle.net/q8btw7Ld/4/

djlone commented 5 years ago

I have the same issue.

D0mcode commented 4 years ago

Looks like you have a 400px offset. Try with this JS:

AOS.init({
        offset: 0, // offset (in px) from the original trigger point
        delay: 0, // values from 0 to 3000, with step 50ms
        anchorPlacement : "center-bottom",
        duration: 1000 // values from 0 to 3000, with step 50ms
  });
andre-brdoch commented 4 years ago

also have a look into this answer: https://github.com/michalsnik/aos/issues/135#issuecomment-290919122

if you have for example images loading (or anything else happening that increases document height) after initializing aos, animations might happen at weird points.