모바일 Safari에서 스크롤을 방지하려면 어떻게 해야 합니까?

Mobile Safari에서 스크롤 동작 제어

귀하의 웹사이트에는 광범위한 콘텐츠가 포함되어 있으며, 페이지 스크롤을 제한하고 그 이상의 정보를 숨기는 방법을 찾고 있습니다. 뷰포트의 가시 영역. 이 기능은 특히 iPhone 및 iPad 장치에서 매우 중요합니다.

초기 문제 해결 시도

오버플로 구현: 숨김; 에만 적용됩니다. CSS 내에서는 모바일 Safari의 스크롤 문제를 해결하지 못하는 것 같습니다. 또한 웹사이트 주위에 포괄적인 래퍼를 만드는 것은 실행 가능한 솔루션이 아닙니다.

효과적인 솔루션

모바일 Safari에서 스크롤을 효과적으로 비활성화하려면 다음 접근 방식을 고려하세요.

• 오버플로 적용: 숨김; 및 CSS의 요소. 이 기술은 유사한 스크롤 문제를 해결하는 데 효과적인 것으로 입증되었습니다.

html,
body {
    overflow: hidden;
}

• iOS 9 기기의 경우 대체 솔루션이 필요할 수 있습니다.

html,
body {
    overflow: hidden;
    position: relative;
    height: 100%;
}

이러한 CSS 조정을 구현하면 모바일 Safari에서 스크롤을 방지하고 페이지 콘텐츠가 보이는 영역 내에 유지되도록 할 수 있습니다. 뷰포트.

위 내용은 모바일 Safari에서 스크롤을 방지하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!