禁止网页缩放

在PC端缩放浏览器的页面主要有三种方式:

  • Ctrl + (+/-)组合
  • Ctrl + 鼠标轮滑
  • 浏览器菜单

我们是禁止不了用户通过浏览器缩放页面,只能通过对有键盘或鼠标事件的快捷方式做监控,从而实现禁止缩放的快捷方式。

禁止Ctrl + (+/-)组合

document.addEventListener('keydown', function (event) {
    if ((event.ctrlKey === true || event.metaKey === true)
       && (event.which === 61 || event.which === 107
          || event.which === 173 || event.which === 109
          || event.which === 187 || event.which === 189)){
            event.preventDefault();
     }
}, false);

event.ctrlKey:键盘的Ctrl键
event.metaKey:mac上的Command

其他为+/-号在不同浏览器的键码。

禁止Ctrl + 鼠标轮滑

document.addEventListener('DOMMouseScroll', function (event) {
  if (event.ctrlKey === true || event.metaKey) {
    event.preventDefault();
  }
}, false);

document.addEventListener('mousewheel', function (event) {
  if (event.ctrlKey === true || event.metaKey) {
    event.preventDefault();
  }
}, false);

DOMMouseScroll是火狐对鼠标轮滑的监听事件。

mousewheel是Chrome,IE对鼠标轮滑的监听事件

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,752评论 1 11
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 1,548评论 0 8
  • 本节介绍各种常见的浏览器事件。 鼠标事件 鼠标事件指与鼠标相关的事件,主要有以下一些。 click 事件,dblc...
    许先生__阅读 2,913评论 0 4
  • 先上个图: 我将整个View分为三个大的模块,并对他们分别进行绘制。包块外面有一个完整的圆环、一段弧(弧度的终点是...
    Drummor阅读 700评论 0 0
  • 写在前面 添加或者删除字段都是使用ALTER 的相关命令 一次操作多个选项STEP1 选中一个表STEP2 操作一...
    望海涯_阅读 469评论 0 0

友情链接更多精彩内容