浏览器viewport缩放问题

[Kelichao]

ViewPort 👍

• 由于目前项目所在电视机屏幕为960*540像素，高度严重不足，导致画面渲染异常

使用ViewPort对移动端页面进行缩放
view主要用于移动端屏幕的缩放与宽度匹配，一般都写定死代码如下

<meta name="viewport" content="
width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

meta的这段代码可以改变缩放比，可以实现类似于放大镜效果，而且不改变浏览器的渲染模式，
非常适用于屏幕大，但是分辨率较低的移动显示设备,注意必须是移动端显示设备，桌面端对此标签无效。

• 真实模拟模拟大分辨率屏幕

比如我以1290来制定基准，不论当前屏幕分辨率为多少，都得到1290px的渲染效果

实现代码

 function setViewport () {
    var vp = $("meta[name=viewport]")[0];
    var sw = $(window).width();
    var stand = 1290;
    // var sh = window.innerHeight;
    // var height = 0;
    
    var sca = sw / stand;
    vp.content = "width=device-width, initial-scale="+ sca　
    +", maximum-scale="+ sca　+", minimum-scale="+ sca　+", user-scalable=no";
};

• 电视机浏览器显示方式切换按钮