您当前的位置：主页 > 教程合集 > 工具推荐 > 网站首页工具推荐

JS设置浏览器缩放比例的实现方法

发布时间：2021-10-09 20:04:00编辑：余斗阅读：(0)字号： 大 中 小

因为 windows10 的操作系统，尽管是19201080的分辨率，但是发现我的页面显示是正常的，但是我同学打开说滚动条特别多，然后就特别的丑陋，尤其是出现了横向的滚动条，这个就很难让人接受。



但是我这边就显示正常，核对了一下，我们用的都是19201080的分辨率，理论上是不会出现这种问题的，于是想到了可能是由于windows 操作系统缩放的问题，windows 操作系统尽管是 1920*1080，但是默认他会推荐你使用125%的缩放比例，也就是说操作系统的所有页面都被放大了，所以说有些布局处理不好可能会出现问题。



想了个办法，仅仅是一个办法哈，理论上是需要适配的，但是没那么多时间去处理那么多事情，关键是不会，想的办法是无论系统给缩放多大的比例，我都给他尽可能的缩回去。

其实他的意思就是进入页面就去检测这个页面有没有被缩放，缩放的比例是多少，125%还是150%，如果是缩放，我们根据现在的展示比例缩放当前页面到100%的感觉，我设置的是125%的时候就缩放现页面的85%，如果是150%的时候就缩放现页面的65%，具体得算，我不会算，我就直接写死了。


var t = window.devicePixelRatio // 获取下载的缩放 125% -> 1.25 150% -> 1.5
if(t != 1){ // 如果进行了缩放，也就是不是1
      document.body.style.zoom = -0.6 * t + 1.55; // 就去修改页面的缩放比例，这个公式我自己算的，不准确，勉强。
}
 

这样不论设置windows系统是125%的缩放比例还是150%的缩放比例，都可以尽可能的在初始化页面的时候恢复到100%的感觉，但是可能会有些问题，但是确实可以实现。

• 转载请注明：JS设置浏览器缩放比例的实现方法
• 版权声明：本站原创文章，由余斗余斗发表在工具推荐分类下，于2021-10-09最后更新