자바스크립트/JavaScript

[JavaScript] 해당 섹션이 화면에 보일 때 애니메이션을 실행하는 코드

KIMJAVAN 2023. 10. 18. 14:07
728x90
    document.addEventListener('DOMContentLoaded', function () {
        var loopSection = document.querySelector('.해당섹션');
        function handleScroll() {
            var rect = loopSection.getBoundingClientRect();
            var isOnScreen = rect.top <= window.innerHeight && rect.bottom >= 0;

            if (isOnScreen) {
                loopSection.classList.add('active');
            } else {
                loopSection.classList.remove('active');
            }
        }
        window.addEventListener('scroll', handleScroll);
        handleScroll(); // Check initial state
    });