Android | iOS compatible keyboard events

Problem Description: When you pull up the keyboard Andrews, will squeeze page H5, the page layout reduce distortion;

      iOS After pulling up the keyboard, underneath there is a blank; (no pictures example, if you forgot even if the bar)

Andrews:

  Android keyboard pull up the page height will account for a similar percentage of the layout, then the page will be compressed, resulting in deformation of serious, can be used when the page height changes, the following content to hide or display

. 1    function the Android () {
 2        // Andrews keyboard adapted bounce page compression 
. 3        const U = the navigator.userAgent;
 . 4        the let = that the this ;
 . 5        IF (u.indexOf ( "the Android")> -1 || u.indexOf ( "the Linux")> -1 ) {
 . 6          // Andrews phone 
7          // get the view of the original height 
. 8          the let screenHeight = document.body.offsetHeight;
 . 9          // is a window resize event bindings 
10          window.onresize = function () {
 . 11            the let nowHeight = document.body.offsetHeight;
 12 is           if (nowHeight < screenHeight) {
13             that.display = "display: none";
14           } else {
15             that.display = "";
16           }
17         };
18       }
19   }
View Code

iOS:

    iOS blank page because after the keyboard pops up stranded (personal understanding), iOS have an elastic stretch, on the blank (I think I have not changed, in fact, I secretly taller)

. 1  function scrollTop () {     // keyboard is pulled away after the initial position, let a page 
2      window.scroll (0, 0 );
 . 3 }
View Code

Above, and the other: H5 is a full page

PS: a lot of strange compatible can be another way, as long as the user has little impact on the use, compatible can tamper with the concept.

Guess you like

Origin www.cnblogs.com/Idlerblogs/p/12482226.html