모바일 소프트 키보드가 팝업되면 레이아웃에 영향을 미칩니다
1) 얼마전에 만든 모바일 페이지는 높이가 1페이지밖에 안되기 때문에 height:100%;width:100%;를 사용했습니다.
iOS에서 입력 상자를 클릭하여 소프트 키보드를 팝업할 때 레이아웃에는 큰 영향이 없습니다.
소프트 키보드로 입력 상자를 눌렀을 때 일부 Android 기기에서는 Huawei 자체 브라우저에 문제가 있으며 UC에서는 레이아웃 문제가 발생합니다.
이유는 소프트 키보드가 뜰 때 높이가 변경되어 height:100%가 원래 높이에 도달할 수 없기 때문일 수 있습니다.
해결책:
$(document).ready(function () {
$('body').height($('body')[0].clientHeight);
});
페이지가 로드된 후 js는 본문에 고정된 높이를 제공합니다.
2) 이전에 모바일 단말기에서 입력란을 클릭하면 페이지가 왼쪽으로 부분적으로 엇갈리는 현상이 발생했는데 너무 길어서 브라우저를 잊어버려서 재생이 안 되는 경우가 있었습니다. 입력란의 크기를 중앙에 맞추는 것입니다.
PS: Huawei 자체 브라우저와 UC의 새로운 유닛이 css3, vw, vh를 인식하지 못하는 것에 대해 불만을 토로하고 있습니다.