精华内容
下载资源
问答
  • JS设置浏览器缩放比例

    千次阅读 2020-08-27 09:31:28
    JS设置浏览器缩放比例 因为 windows10 的操作系统,尽管是19201080的分辨率,但是发现我的页面显示是正常的,但是我同学打开说滚动条特别多,然后就特别的丑陋,尤其是出现了横向的滚动条,这个就很难让人接受,但是...

    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){   // 如果进行了缩放,也就是不是1
       document.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获取浏览器缩放比例

    千次阅读 2019-10-05 04:42:52
    前几天在做项目的时候遇到浏览器缩放比例不为100%时,出来的页面不正常,于是找到了方法获取其比例来通知用户 function detectZoom (){ var ratio = 0, screen = window.screen, ua = navigator.userAgent...

    前几天在做项目的时候遇到浏览器缩放比例不为100%时,出来的页面不正常,于是找到了方法获取其比例来通知用户

    function detectZoom (){ 
      var ratio = 0,
        screen = window.screen,
        ua = navigator.userAgent.toLowerCase();
    
       if (window.devicePixelRatio !== undefined) {
          ratio = window.devicePixelRatio;
      }
      else if (~ua.indexOf('msie')) {  
        if (screen.deviceXDPI && screen.logicalXDPI) {
          ratio = screen.deviceXDPI / screen.logicalXDPI;
        }
      }
      else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
        ratio = window.outerWidth / window.innerWidth;
      }
      
       if (ratio){
        ratio = Math.round(ratio * 100);
      }
      
       return ratio;
    };

    推荐地址:http://www.jb51.net/article/55753.htm

    转载于:https://www.cnblogs.com/xiaoyaoxingchen/p/9057387.html

    展开全文
  • { ratio = window.outerWidth / window.innerWidth } if (ratio) { ratio = Math.round(ratio * 100) } return ratio }, 效果: 上面这个125就是电脑设置的缩放率125 注意在这个方法也会包括浏览器缩放
    //方法
    detectZoom() {
       let ratio = 0
       const screen = window.screen
       const ua = navigator.userAgent.toLowerCase()
       if (window.devicePixelRatio !== undefined) {
          ratio = window.devicePixelRatio
       } else if (~ua.indexOf('msie')) {
          if (screen.deviceXDPI && screen.logicalXDPI) {
            ratio = screen.deviceXDPI / screen.logicalXDPI
          }
       } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
            ratio = window.outerWidth / window.innerWidth
       }
       if (ratio) {
         ratio = Math.round(ratio * 100)
       }
          return ratio
    },

    效果:

     上面这个125就是电脑设置的缩放率125
    注意在这个方法也会包括浏览器的缩放率

    展开全文
  • NULL 博文链接:https://gbk2312.iteye.com/blog/689144
  • js获取电脑及浏览器缩放比例 文章目录js获取电脑及浏览器缩放比例前言 前言 js获取电脑及浏览器缩放比例 function detectZoom() { let ratio = 0 const screen = window.screen const ua = navigator.userAgent....

    js获取电脑及浏览器缩放比例

    前言

    js获取电脑及浏览器缩放比例

    function detectZoom() {
          let ratio = 0
          const screen = window.screen
          const ua = navigator.userAgent.toLowerCase()
          if (window.devicePixelRatio !== undefined) {
            ratio = window.devicePixelRatio
          } else if (~ua.indexOf('msie')) {
            if (screen.deviceXDPI && screen.logicalXDPI) {
              ratio = screen.deviceXDPI / screen.logicalXDPI
            }
          } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
            ratio = window.outerWidth / window.innerWidth
          }
          if (ratio) {
            ratio = Math.round(ratio * 100)
          }
          return ratio
        },
    

    好用哦~~~

    展开全文
  • JS不能调整浏览器的显示比例,仅能查看 //调整浏览器显示比例【仅能查看】 function ChangeRatio() { var ratio=0; var screen=window.screen; var ua=navigator.userAgent.toLowerCase(); if(window.device...
  • 查看浏览器缩放比例,不是 100% 则给出提示 let rate = ChangeRatio(); console.log("sr" + rate); if(rate != 100){ alert('当前页面不是100%显示,请按键盘ctrl+0恢复100%显示标准,以防页面显示错乱!'); } ...
  • js检测浏览器缩放百分比方法

    千次阅读 2019-12-26 09:34:43
    detectZoom (){ var ratio = 0, screen = window.screen, ua = navigator.userAgent.toLowerCase(); if (window.devicePixelRatio !== undefined) { ...该方法的返回值就是浏览器缩放的百分比
  • 这个只适用于ie,其他浏览器好像默认禁用这种行为吧,求兼容 ``` <!DOCTYPE html> <title>window <script src="js/jquery-1.11.3.min.js"> * {padding: 0; margin: 0;} ...
  • 检测当前浏览器是否缩放 https://github.com/Johnqing/browserZoom 转载于:https://www.cnblogs.com/starweb/archive/2013/02/16/2913520.html
  • <script src="./js/jquery.min.js">  页面头部    <font color="red"><b>总有纳闷一群人</b></font>  页面中部奥术大师    页面尾部    $(function(){  //通过修改CSS使文本居中  $(".top")...
  • js控制浏览器放大或者缩小

    千次阅读 2020-07-07 15:35:02
    希望改变当前页面所在的浏览器窗口的大小 解决方案: 使用window对象的方法:resizeTo()和resizeBy()。比如: window.resizeTo(800, 600); // 将窗口大小调整为宽800,高600,单位为像素 window.resizeBy(50, 50); //...
  • js缩放网页比例

    万次阅读 2018-06-22 16:06:30
    将当前网页缩放比变为200%document.getElementsByTagName('body')[0].style.zoom=2原文链接:https://segmentfault.com/q/1010000007208897
  • 浏览器固定缩放比例

    千次阅读 2020-03-16 15:06:38
    1、看了好多博客,都是以下面代码为准 ... // 判断pc浏览器是否缩放,若返回100则为默认无缩放,如果大于100则是放大,否则缩小 function detectZoom (){ var ratio = 0, screen = window.screen, ...
  • 使用js还原浏览器缩放

    千次阅读 2018-03-13 16:32:09
    移动端,使用手机浏览器打开一个网页,双指可以进行网页的缩放,非常方便 1:缩放前 2:缩放后 3:有没有一种方法,可以还原到原始状态呢。 目前发现一种方法,动态修改viewport,head 中增加标签 &...
  • 此时考虑变动时重新赋予宽度,但非当前页面缩放再跳回时会出现获取宽度值错误导致文字丢失,所以记录了初始宽度值,并根据获取当前缩放比进行计算,以下是获取页面缩放率的函数 function getWindowRatio(){ var ratio=0...
  • PC端js禁止浏览器缩放

    千次阅读 2019-08-14 17:12:59
    1.网上的资料大多都是按照windows的devicePixelRatio来判断是否缩放的,这个判断不是很准确,因为在mac下,默认的devicePixelRatio是为2的,所以需要根据不同的操作系统来判断缩放比例。 devicePixelRatio详细介绍...
  • 主要介绍了JS实现控制图片显示大小的方法,即实现图片等比例缩放功能,涉及JS动态操作页面元素属性相关技巧,需要的朋友可以参考下
  • 页面按比例缩放JS.rar

    2020-08-31 16:00:39
    网页按比例缩放JS脚本,在页面上应用此JS,页面即可按浏览器比例缩放。。。。。。。。。。。。。。。。。。
  • 那么问题来了,有没有方法 **用js浏览器恢复到初始比例呢?** 我已经尝试过下面的方法,都不行: 1.直接修改window.innerWidth/window.innerHeight这一对值,没有任何变化 2.window.resizeTo():只有部分手机...
  • 首先说明,这里所说的浏览器状态是指用户点击浏览器左上角的放大加号/减号所产生的页面整体变大变小的情况(快捷键:Ctrl+加号或 Ctrl+减号 或 Ctrl+滚轮上下) 实现代码如下: detectZoom 函数的返回值如果是 100...
  • js获取页面缩放比例

    千次阅读 2020-01-07 10:01:58
    //获取当前页面的缩放值 function detectZoom() { var ratio = 0, screen = window.screen, ua = navigator.userAgent.toLowerCase(); if (window.devicePixelRatio !== undefi...
  • 禁用浏览器缩放功能(js

    千次阅读 2019-12-23 14:55:36
    一、移动端禁止缩放 移动端在禁止缩放上比较简单,添加meta标签即可 <meta name="viewport" content=" width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-...
  • 一些网站的首页背景图尺寸不随浏览器缩放而变化,例如百度个人版的首页,缩放后背景图的尺寸并不改变:  再比如花瓣网( huaban.com ):   现在用CSS来实现这一效果。 首先需要一张足够大尺寸的图片,上图百度...
  • 实现类似浏览器缩放页面比例

    千次阅读 2017-04-01 14:47:33
    用浮点数来定义缩放比例。不允许负值 : 用百分比来定义缩放比例。不允许负值 例子: body{ zoom: 70%;  } transform : none| transform-functions 值: none 定义不...
  • 禁止浏览器缩放

    2019-10-11 15:07:35
    移动端页面禁止用户缩放界面只需加上即可,但是pc端确实比较麻烦...由于浏览器菜单栏属于系统软件权限,没发控制,我们着手解决ctrl/cammond + +/- 或 Windows下ctrl + 滚轮 缩放页面的情况,只能通过js控制了 Re...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 17,431
精华内容 6,972
关键字:

js控制浏览器缩放比例