study develop mobile of h5

1. why is layoutViewport？

   var layoutViewportWidth = document.documentElement.clientWidth;

layoutViewportWidth is width of layoutViewport;OfCause you can regard　is as the width of htmlElement;

2.window.screen.width　is the device screen of width in logical pixel;

3.visualViewPort that you can regard it as eyes; if visualViewPort is big and will see more element;

   var visualViewportWidth = window.visualViewport.width;
   var scale = window.visualViewport.scale

if scale == 1 ;visualViewportWidth equal the the width of brower in logical pixel;
4.

 var innerWidth = window.innerWidth;

innerWidth is wdith of the biggest of element;

sunch as

even　though　the body is 985px but the div width the biggest width is in body; os the innerwidth is 1200px;