2017-05-22 1 views
0

나는 이것을 설명하기 위해 최선을 다할 것입니다. 임의의 iPhone에서 target.com 또는 amazon.com으로 이동하여 왼쪽 또는 오른쪽으로 스 와이프하려고하면 페이지가 움직이지 않습니다. 누군가가 왼쪽이나 오른쪽으로 스 와이프하면 홈 페이지 만 이동하는 웹 사이트가 있습니다. 화면을 놓으면 화면이 중간으로 돌아 오지만 여전히 성가시다. iPhone에서만 발생하며, iPhone 7과 관련이 없으며 어디에서 스 와이프하여 앞으로 또는 앞으로 갈 수 있습니다. 문제를 해결 한 것은 페이지에서 축소 한 다음 다시 정상으로 돌아 왔을 때만 왼쪽 및 오른쪽으로 쓸어 넘지 못하게 할 수 있습니다. 다음을 확인할 수있는 웹 사이트 링크가 있습니다. airlinehyd.comiPhone에서 페이지를 왼쪽이나 오른쪽으로 스 와이프하지 못하게하면

jQuery 또는 CSS를 통해이 기능을 끌 수 있습니까? 본문에 overflow-x: hidden;을 추가하려고 시도했지만 아무 것도하지 않습니다. 어떤 아이디어?

답변

0
html { 
overflow: hidden; 
/* height: 100%; I commented out this declaration because it messes up your scrolling */ 
} 

body { 
height: 100%; 
overflow: auto; 
} 

출처 : Prevent "overscrolling" of web page

생산으로 밀어 넣기 전에 모든 브라우저에서 그뿐만 아니라 모바일을 테스트해야합니다하지만 아이폰에서 작동 않습니다.

+0

이 기능은 원하는대로 작동하지만 검사 도구를 사용할 때 스크롤을 방지하므로 다른 해결책을 찾아야합니다. – xohbrittx

+0

클래스 또는 ID를 포함하는 선택기에이 규칙을 추가하지 마십시오. 선택기가'html {}'및'body {}'라고 말했는지 확인하십시오. css의 맨 아래에 새 규칙을 작성하여 확인하십시오. 그리고 경우에 대비해 오래된 'overflow-x : hidden'을 몸에서 제거하십시오. 이 수정 프로그램은 Safari Mobile Web Inspector (iphone)를 사용하여 웹 사이트에서 정상적으로 작동하며 구현시 스크롤을 중단하지 않습니다. –

+0

'html {}'내부에서'height : 100 %'를 주석 처리하기 전에 내 솔루션을 시도했을 것입니다. 회색 영역이 표시된 업데이트 된 답변을 참조하십시오. 'height : 100 %;'를'html {}'선택자에 포함 시켰을 때, 스크롤이 약간 방해가되었습니다. 내가 그것을 주석 처리했을 때, 매력처럼 작동합니다. 또는 아마도이 도구를 사용하려는 개발 환경이 사용자가 지적한 실제 사이트와 다를 수 있습니다. 주석 처리 된'height : 100 %'를 사용하여 위의 해결책을 이미 시도한 적이 있다면 주석을 달고 주석이 작동하는지 확인하십시오. –

관련 문제