dfsddf

<style>
  #hz {
    border: 1px solid silver;
    width: 300px;
    height: 200px;
    overflow: scroll;
  }
  #hz p {width:900px; height:400px;}

  @media (max-width: 991px) {
    #hz {
      width: 100%;
      height: 80vh;
    }

    #hz p {
      width: 100%;
      height: 130vh;
    }
  }
  </style>
  
  <div id="hz" onscroll="homzzang()">
    <p>홈짱닷컴 Homzzang.com<p>
  </div>
  <p>Scroll 횟수 : <span id="demo">0</span></p>
  <button id="btn" disabled>눌러봐라</button>
  
  <script>
  const scroller = document.querySelector("#hz");
  const output = document.querySelector("#demo");

  const scrollHeight = document.documentElement.scrollHeight;
  const scrollTop = scroller.scrollTop;
  const clientHeight = document.documentElement.clientHeight;

  var x = 0;
  function homzzang() {
    let xi = document.getElementById("demo").innerHTML = x += 1;
    // console.log(xi);
    console.log(scroller.scrollHeight, scroller.scrollTop, scroller.clientHeight);
  }


  scroller.addEventListener("scroll", event => {
    output.textContent = `scrollTop: ${scroller.scrollHeight - scroller.scrollTop}, clientHeight: ${scroller.clientHeight}`;
    if(scroller.scrollHeight - scroller.scrollTop <= scroller.clientHeight || scroller.scrollHeight - scroller.scrollTop <= scroller.clientHeight-0.5 ||
    (scroller.scrollHeight - scroller.scrollTop)-0.5 <= scroller.clientHeight) {
      document.getElementById("btn").disabled = false;
    }
  });
  </script>