스크롤 막대를 숨기지 않고 JavaScript에서 스크롤을 일시적으로 비활성화하는 방법은 무엇입니까?

스크롤을 일시적으로 비활성화하는 방법

scrollTo jQuery 플러그인을 사용하는 동안 스크롤을 일시적으로 비활성화하는 한 가지 방법은 "body"의 CSS를 조정하는 것입니다. " 요소. 그러나 이 접근 방식은 스크롤바를 숨길 수 있어 바람직하지 않을 수 있습니다.

더 효과적인 솔루션은 특정 상호 작용 이벤트가 스크롤을 트리거하지 못하도록 방지하는 것입니다. 이러한 이벤트에는 다음이 포함됩니다.

• 마우스 스크롤
• 터치 스크롤
• 스크롤과 관련된 버튼

이 솔루션을 구현하려면 다음을 사용할 수 있습니다. 다음 JavaScript 코드:

// Disable scrolling
function disableScroll() {
  window.addEventListener('DOMMouseScroll', preventDefault, false); // older FF
  window.addEventListener('wheel', preventDefault, { passive: false }); // modern desktop
  window.addEventListener('touchmove', preventDefault, { passive: false }); // mobile
  window.addEventListener('keydown', preventDefaultForScrollKeys, false);
}

// Enable scrolling
function enableScroll() {
  window.removeEventListener('DOMMouseScroll', preventDefault, false);
  window.removeEventListener('wheel', preventDefault, { passive: false }); 
  window.removeEventListener('touchmove', preventDefault, { passive: false });
  window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}

이 코드는 창에 이벤트 리스너를 설정합니다. 기본 스크롤 작업이 실행되는 것을 방지하는 요소입니다. 스크롤을 비활성화해야 할 경우, 비활성화Scroll() 함수를 호출하십시오. 스크롤을 다시 활성화하려면 활성화Scroll() 함수를 호출하세요.

이 방법을 사용하면 스크롤 막대가 계속 표시되지만 스크롤에 사용되는 것은 방지됩니다. 또한 다양한 브라우저에서 작동합니다.

위 내용은 스크롤 막대를 숨기지 않고 JavaScript에서 스크롤을 일시적으로 비활성화하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!