脚本工作并添加类“Complete”。

window.addEventListener("scroll", function() {
    var scrollFadeClass = document.querySelectorAll(".scrollfade");

    scrollFadeClass.forEach((scrollfade) => {
        var offsetTop = window.scrollY + scrollfade.getBoundingClientRect().top;
        var scrollTop = window.scrollY;

        if (scrollTop + (window.innerHeight / 2.5) > scrollfade.offsetTop) {
                scrollfade.classList.add("complete");
            };
        });
});

问题就在这里，当scrollfade位于div的第2部分时，它遵循创建的if条件

window.addEventListener("scroll", function() {
    var scrollFadeClass = document.querySelectorAll(".scrollfade");

    scrollFadeClass.forEach((scrollfade) => {
        var offsetTop = window.scrollY + scrollfade.getBoundingClientRect().top;
        var scrollTop = window.scrollY;

        if (scrollTop + (window.innerHeight / 2.5) > scrollfade.offsetTop) {
                scrollfade.classList.add("complete");
            };
        });
});

如果scrollfade位于第3个div中，则它不遵循if条件，当我将它移动到第2个div时，它突然遵循if条件

window.addEventListener("scroll", function() {
    var scrollFadeClass = document.querySelectorAll(".scrollfade");

    scrollFadeClass.forEach((scrollfade) => {
        var offsetTop = window.scrollY + scrollfade.getBoundingClientRect().top;
        var scrollTop = window.scrollY;

        if (scrollTop + (window.innerHeight / 2.5) > scrollfade.offsetTop) {
                scrollfade.classList.add("complete");
            };
        });
});

顺晟科技：