AOS とか、スクロールで起動するアニメーションのライブラリを使うとき、もしくは普通にスクロールでアニメーションを動かすとき。
必要なことに、各要素の位置の取得があります。
AOSを使う場合は、JSで
AOS.init();
をします。
で、このタイミングが document.addEventListener('DOMContentLoaded'だと、上手くいきません。正確に言えば、うまくいく場合もあるけど、画像とかあると厳しい。
それは、主に画像等の容量が大きいもののロードが済まないうちにoffsetTopの値を取るから。一部の読み込めていない画像がない場合の一番上からの高さをとってしまいます。
なので、window.addEventListener('load'の中でInitしてoffsetTopの値をとるようにしましょう。
