모바일 브라우저 다르게 보이는 현상이 있습니다.
관련링크
본문
안녕하세요. 해피정 입니다.
스마트기기에는 다양한 브라우저가 존재합니다.
아이폰 사파리, Brave, Chrome, Dolphin, Firefox, Edge, Opera, Whale
안드로이드 인터넷, Brave, Chrome, Dolphin, Firefox, Edge, Opera, Whale
위와같이 다양한 브라우저에서 한가지 문제에 대한 테스트를 했습니다.
링크의 홈페이지는 상단과 하단을 고정하는 스크립트가 포함된 상태입니다.
아이폰에 설치된 모든 브라우저에서는 의도한 모습으로 정상적으로 상단과 하단이 고정된 상태로 브라우징이 가능합니다.
안드로이드에 설치된 브라우저에서는 인터넷(기본브라우저)와 Dolphin 은 정상적으로 보여지지만
Brave, Chrome, Firefox, Edge, Opera, Whale 은 위아래로 스크롤을 하면 고정되어야할 영역이
반쯤 숨는 현상이 발생합니다.
스크롤을 위로 올리면 위쪽 고정이 반쯤 숨고,
스크롤을 아래로 내리면 아래 고정이 반쯤 숨고,
아이폰 설치 브라우저는 사파리 기반이고
안드로이드 브라우저는 크롬 기반이라 그런가 하고 추측을 하는데
이런 현상에 대한 문제를 경험하셨거나, 해결방법을 아시는분 도움 부탁드립니다.
PC에서는 익스플로러 호환성때문에 머리아팠는데
스마트폰은 아이폰과 안드로이드 브라우저를 모두 테스트해야하는 상황이니 답답합니다.
답변 1
meta viewport의 user-scalable=no 한번 해보세요.. 안드로이드 fixed 관련 버그로
얼핏 기억하는데....테스트 해볼수도 없는 환경고 아니고....그냥 추측입니다..
도움이 되셧으면 좋겠네요
그것을 수정하니 정상 작동합니다. 감사합니다.