有人可以向我解释这个函数的作用是什么

Question

我可以理解这段代码中发生了什么。有人可以向我解释发生了什么事吗

我试图分析每个功能，但我还是不明白

var animatepage = function() {

    var elems;

    var windowHeight;

    function init() {

        elems = document.querySelectorAll(".hidden");

        windowHeight = window.innerHeight;

        addEventHandlers()

        checkPosition()

    }

    function addEventHandlers() {

       window.addEventListener('scroll', checkPosition);

       window.addEventListener('resize', init)

    }

    function checkPosition() {

        for(var i=0; i < elems.length; i++) {

            var positionTop = elems[i].getBoundingClientRect().top;

            if ((positionTop-windowHeight) <= 0) {

                elems[i].className = elems[i].className.replace(

                    'hidden',

                    'fade-in-element'

                );

            };

        };

    };

    return {

        init: init

    };

};

animatepage().init();

Answer 1

目的是在元素在页面中可见时添加 CSS 类“fade-in-element”。init()&nbsp;查找所有具有“隐藏”CSS 类的元素。addEventHandlers()&nbsp;确保如果用户滚动或调整其窗口大小，我们会检查是否有任何新元素可见checkPosition()然后查找当前可见的所有元素，并为它们提供 CSS 类“fade-in-element”。该类可能会包含一些 CSS 过渡，以使元素慢慢淡入。