JS设置浏览器缩放比例
JS设置浏览器缩放比例
因为 windows10 的操作系统,尽管是19201080的分辨率,但是发现我的页面显示是正常的,但是我同学打开说滚动条特别多,然后就特别的丑陋,尤其是出现了横向的滚动条,这个就很难让人接受,但是我这边就显示正常,核对了一下,我们用的都是19201080的分辨率,理论上是不会出现这种问题的,于是想到了可能是由于windows 操作系统缩放的问题,windows 操作系统尽管是 1920*1080,但是默认他会推荐你使用125%的缩放比例,也就是说操作系统的所有页面都被放大了,所以说有些布局处理不好可能会出现问题。
想了个办法,仅仅是一个办法哈,理论上是需要适配的,但是没那么多时间去处理那么多事情,关键是不会,想的办法是无论系统给缩放多大的比例,我都给他尽可能的缩回去。
参考这个文章:https://www.zhihu.com/question/337698525/answer/767943139
其实他的意思就是进入页面就去检测这个页面有没有被缩放,缩放的比例是多少,125%还是150%,如果是缩放,我们根据现在的展示比例缩放当前页面到100%的感觉,我设置的是125%的时候就缩放现页面的85%,如果是150%的时候就缩放现页面的65%,具体得算,我不会算,我就直接写死了。
var t = window.devicePixelRatio // 获取下载的缩放 125% -> 1.25 150% -> 1.5
if(t != 1){ // 如果进行了缩放,也就是不是1document.body.style.zoom = -0.6 * t + 1.55; // 就去修改页面的缩放比例,这个公式我自己算的,不准确,勉强。
}
这样不论设置windows系统是125%的缩放比例还是150%的缩放比例,都可以尽可能的在初始化页面的时候恢复到100%的感觉,但是可能会有些问题,但是确实可以实现。
优化
var t = window.devicePixelRatio // 获取下载的缩放 125% -> 1.25 150% -> 1.5
document.body.style.zoom =1/ t; // 就去修改页面的缩放比例
JS设置浏览器缩放比例相关推荐
- JS设置浏览器URL,任意定制,安全可靠
背景 Java Web工程登陆后,浏览器地址显示的../login 问题 刷新页面就返回到登陆页面 解决思路 1.后台设置URL 2.JS设置URL 测试 优先,2号方案,原因是方便简单 测试源码 1 ...
- js设置浏览器不缓存
关于浏览器缓存 浏览器缓存,有时候我们需要他,因为他可以提高网站性能和浏览器速度,提高网站性能.但是有时候我们又不得不清除缓存,因为缓存可能误事,出现一些错误的数据.像股票类网站实时更新等,这样的网站 ...
- Firefox(火狐浏览器) 调试js设置
Firefox(火狐浏览器) 调试js设置 步骤1: 安装插件 在Firefox(火狐浏览器) 的菜单栏目中点"工具"->"附加组件"->找到& ...
- js设置div透明度
原生js设置透明度 为了兼容IE与其他浏览器对透明度的设置,我们需要对以上两种样式分别进行设置: 复制代码代码如下: var alpha = 30; //透明度值变量 var oDiv = docum ...
- JS获取浏览器高度 并赋值给类
JS获取浏览器宽高的兼容写法: var w = window.innerWidth || document.documentElement.clientWidth || document.body.c ...
- js判断wifi_使用JS在浏览器中判断当前网络连接状态的几种方法
使用JS在浏览器中判断当前网络状态的几种方法如下: 1. navigator.onLine 2. ajax请求 3. 获取网络资源 4. bind() 1. navigator.onLine 通过na ...
- js实现浏览器后退页面刷新
最近在开发中遇到一个问题: 在一个列表页面,点击进入详情,详情页面对其状态操作,其详情页面有做修改,然后点击浏览器后退,返回到列表页,在列表页面状态还是操作之前的,为解决状态统一需要手动刷新改列表页. ...
- html js 浏览器语言,js 判断浏览器语言的方法
今天遇到一个要根据浏览器设置语言的类型,来展示网站的字体.比如,浏览器的语言是中文简体,那么网站也要显示中文简体字,如果是繁体或是英文都要根据浏览器当前设置的语言进行显示.那么,飞鸟慕鱼博客来和大家说 ...
- JS 获取浏览器、显示器 窗体等宽度和高度
转载自 JS 获取浏览器.显示器 窗体等宽度和高度 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见 ...
最新文章
- php csv文件的读取,写入,输出下载操作详解
- 喜讯丨神策数据四大客户案例斩获大数据“星河”案例
- leetcode98. 验证二叉搜索树
- SPH(光滑粒子流体动力学)流体模拟实现四:各向异性(Anisotropic)表面光滑(2)
- ORACLE 11G DATA GUARD配置之Dataguard基本原理
- vue+django 生鲜项目 (二)
- 手把手教你详细分析 Chrome 1day 漏洞 (CVE-2021-21224)
- elf文件格式_Android so(ELF) 文件解析
- 数论著作读书笔记(2013-04-14 23:22)
- 一文解析圆柱锂电外观缺陷检测问题
- OC中内存管理(转)
- PenTesters框架(PTF)
- Self-Supervised Learning 自监督学习中Pretext task的理解
- Linux - Shell基本命令
- 哐筹甍颚往往能够用它实现
- Matplotlib风格与样式
- 蓝桥杯 算法提高 阮小二买彩票 Python
- 你改变不了环境,但你可以改变自己
- electron打包后在win7上打开异常KERNEL32.dll
- 轻量级的Java快速开发平台