> 웹 프론트엔드 > CSS 튜토리얼 > iOS의 내 iPad 웹사이트에 스크롤바가 없는 이유는 무엇입니까?

iOS의 내 iPad 웹사이트에 스크롤바가 없는 이유는 무엇입니까?

DDD
풀어 주다: 2024-10-27 05:24:03
원래의
559명이 탐색했습니다.

Why Are Scrollbars Missing on My iPad Website in iOS?

iOS 스크롤바 문제: CSS 오버플로 문제 해결

iPad 웹 사이트를 개발하면서 예상치 못한 문제를 발견했습니다. CSS 오버플로 속성(오버플로: 자동 또는 스크롤) 두 손가락 스크롤을 활성화해도 스크롤 막대를 표시하지 못합니다. 이 문제는 iOS 기기에만 적용됩니다.

문제 해결:

업데이트된 수정 사항(iOS 5beta 이상):

kritzikratzi가 지적한 대로 iOS 5beta에 도입된 새로운 속성(-webkit-overflow-scrolling: touch)을 사용하면 이 문제를 해결할 수 있으며 예상되는 스크롤 동작을 실행할 수 있습니다.

원래 해결 방법(iOS 5 및 아래):

안타깝게도 iOS 기기에서는 제한된 화면 공간으로 인해 Overflow: auto나 스크롤 모두 스크롤 막대를 생성하지 않습니다. 대신, 두 손가락 스와이프 메커니즘은 넘쳐나는 콘텐츠를 스크롤하기 위해 지정된 방법입니다.

대안:

  • JavaScript 및 jQuery: JavaScript 및 jQuery와 같은 라이브러리를 활용하여 오버플로 요소에 대한 사용자 정의 스크롤 막대를 만듭니다.
  • @media 쿼리: iPhone 기기에서 오버플로를 숨기고 콘텐츠 전체를 표시하려면 @media 쿼리를 사용하세요.

@media 쿼리 사용 예:

<link rel="stylesheet" href="handheld.css" media="only screen and (max-device width:480px)" />
로그인 후 복사

위 내용은 iOS의 내 iPad 웹사이트에 스크롤바가 없는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿