PC端js禁止浏览器缩放

最新推荐文章于 2025-05-22 09:16:29 发布

Noblesse-

最新推荐文章于 2025-05-22 09:16:29 发布

阅读量5.9k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：基础知识相关文章标签：浏览器缩放 pc监听浏览器缩放 pc禁止浏览器缩放禁止浏览器缩放

本文链接：https://blog.youkuaiyun.com/wen81643956/article/details/99586314

在网上找了很多资料，多多少少都有一些问题，现在重新整理一下。

1.网上的资料大多都是按照windows的devicePixelRatio来判断是否缩放的，这个判断不是很准确，因为在mac下，默认的devicePixelRatio是为2的，所以需要根据不同的操作系统来判断缩放比例。

devicePixelRatio详细介绍参考张鑫旭老师的博客https://www.zhangxinxu.com/wordpress/2012/08/window-devicepixelratio/ ，有兴趣的可以去了解一下

2. 监听鼠标滚动的代码也有问题，事件无法监听到，这里也重新改了一下，在windows和mac下自测都是ok的。

下面直接贴代码：

<script>
      // 判断pc浏览器是否缩放，若返回100则为默认无缩放，如果大于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.logical