移动端软键盘弹出挤压页面和单位是vh横屏页面时，页面被挤压

公司项目是微信公众号网页，用的是Jquery,单位是vh,这就导致横屏时页面高度很小，元素都都被压缩，我自己看着都难受，就不要说用户了。

还有当软键盘弹出时页面也会受到挤压，那怎么解决的呢？

看，代码–

---

a.html

 

b.js

function transverse(height){

        var dom=document.getElementById('metaid');

        var metaStr='height='+height+',width=device-width,initial-scale=1.0,user-scalable=no';

        dom.setAttribute('name', 'viewport');

        dom.setAttribute('content', content);

    }

  var getheight=window.innerHeight>window.innerWidth?window.innerHeight:window.innerWidth;

    transverse(getheight);

---

其实原理非常简单，就是当高度小于宽度时，把宽度赋值给高度，也就是说当屏幕横向时，把横向的宽度赋值给高度。遇到相似难题的可以一试。

原文链接：https://blog.csdn.net/weixin_44989478/article/details/103783418