JavaScript / scroll stop event 주기

Web dev/JavaScript

JavaScript / scroll stop event 주기

양여리 2022. 4. 16. 14:47

728x90

유용할 것 같아서 메모 ㅎㅎ

바닐라스크립트로 scrollstop 이벤트 주기

<!doctype html>
<html>
<body style="height: 200px;">
  <div style="background: silver; height: 600px;">
    Scroll me up, down, up down and stop!
  </div>
  <script>
    
    function createScrollStopListener(element, callback, timeout) {
        var handle = null;
        var onScroll = function() {
            if (handle) {
                clearTimeout(handle);
            }
            handle = setTimeout(callback, timeout || 200); // default 200 ms
        };
        element.addEventListener('scroll', onScroll);
        return function() {
            element.removeEventListener('scroll', onScroll);
        };
    }

    // Example usage:

    createScrollStopListener(window, function() {
        console.log('onscrollstop');
    });

  </script>
</body>
</html>

728x90