확대/축소시 iOS의 페이지 크기가 변함

Question

iOS (Safari 및 iOS 용 Chrome)에 몇 가지 문제가 있습니다. 사용자가 페이지를 확대하면 자바 스크립트를 사용하여 배치 된 일부 내용을 엉망으로 만드는 크기가 변경되는 것 같습니다 (크기 조정 자바 스크립트 이벤트가 수십 번 발생합니다). 너무 많은 시간이 걸려서 어떤 것이 마지막인지 알 수 없기 때문에 resize 이벤트를 바인딩하여 해결할 수 없습니다.

저는 행운 (너비, 초기 배율, 최대 배율, 최소 배율)이있는 뷰포트에서 여러 옵션을 설정해 보았습니다.

고정 된 위쪽, 오른쪽, 왼쪽 및 위쪽으로 고정 된 위치 div가 하나 있습니다. 그 안에 몇 개의 절대 div가 있으며 크기와 위치는 %로 설정되어 있습니다.

확대 된 후 축소하면 화면의 오른쪽과 아래쪽에 빈 경계가 표시되므로 페이지 크기가 실제로 변경되는 것처럼 보입니다. 나는 이런 일이 일어나지 않도록하고 싶다.

Answer 1

문제점을 발견했습니다. 페이지 자체의 크기가 조정되지 않고 고정 된 위치에 있던 요소가 있습니다. 그가 고정 된 경우 고정 된 위치 지정이 사용자의 시야를 따른다는 것을 알게되었습니다. 내가 찾은 유일한 해결책은 모든 고정 된 위치를 절대 위치 지정으로 변경하는 것입니다 (제 경우에는 통증이 될 것입니다).

resize 이벤트가 창에 바인딩되어 있기 때문에 확대/축소시 뷰가 변경되어 크기 조정 기능이 트리거된다는 것을 발견했습니다. 다른 요소에 대한 크기 조정 이벤트 does not work (내 경우 실제로 필요한 것은 본체의 크기 조정을 보는 것입니다).

Answer 2

초기 버전의 iOS Safari/Chrome에서도 그런 성격의 문제를 인식하지 못했습니다. 어떤 iOS 버전을 사용하고 계십니까? OSX에 액세스 할 수 있다면 iOS 시뮬레이터에서 사용할 수있는 모든 iOS 버전에서 Safari를 테스트 해 보셨습니까? iPad에서 동일한 동작을합니까? 작은 뷰포트에서 다른 브라우저를 테스트 해 보셨습니까? 크기 조정 이벤트가 너무 많이 호출되는 것에 대해 언급합니다.

나는 다음과 같은 코드로 작동하는 간단한 스타일과 전혀 자바 스크립트 간단한 HTML 페이지를 얻으려고합니다 : 것을 그렇지 않으면 ...

<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"> 

위의 코드는 불가능 확대해야 간단한 설정으로 작업하면 테스트중인 iOS 버전에 익숙하지 않은 버그가 있습니다.

그런데 작동하는 경우 코드에 viewport 태그를 재정의하는 것이 있습니다.