모바일 웹 개발과 PC측의 차이점은 휴대폰에서의 입력이 소프트 키보드이기 때문에 문제가 있을 것입니다. 즉, 입력이 있을 때 키보드가 튀어나오고 전체가 페이지가 부득이하게 변경됩니다. 이 문제를 해결하는 방법? 아래에서는 모바일 웹 개발 시 휴대폰 입력창이 뜨는 문제를 해결하기 위해 Script House 에디터가 JS를 여러분께 공유해 드립니다.
모바일 웹 개발과 PC 측의 차이점은 휴대폰은 소프트 키보드라서 그럴 겁니다. 문제는 입력이 있을 때 키보드가 튀어나와 페이지 전체가 필연적으로 바뀌는 것입니다
1. 페이지 배경을 개선하면
해결 방법은 본문에 있습니다. 페이지를 올려도 배경은 그대로 유지됩니다.
2. 하단의 고정 레이아웃을 사용하세요. >
이 문제로 인해 페이지가 올라가고 그에 따라 하단의 수정 사항도 올라가서 해당 페이지를 덮게 됩니다. 이에 대한 해결책은 두 가지가 있습니다.먼저, 페이지가 그에 따라 페이지가 얼마나 변경되는지 위의 페이지를 스크롤하도록 허용해야 합니다.
$('input').bind('click',function(e){ var $this = $(this); e.preventDefault(); setTimeout(function(){ $(window).scrollTop($this.offset().top - 10); },200) })
2, 고정 요소를 숨긴 후 페이지 입력이 완료되면 표시
var original = document.documentElement.clientHeight; window.addEventListener("resize", function() { var resizeHeight = document.documentElement.clientHeight; if(resizeHeight != original) { $('.bottom-button').css('display', 'none'); } else { $('.bottom-button').css('display', 'block'); } });
위 내용은 JS는 모바일 웹 개발에서 휴대폰 입력창 팝업 관련 예제 코드를 해결합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!