美文网首页
禁止网页缩放

禁止网页缩放

作者: 岳小弟 | 来源:发表于2018-06-04 18:10 被阅读0次

    在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对鼠标轮滑的监听事件

    相关文章

      网友评论

          本文标题:禁止网页缩放

          本文链接:https://www.haomeiwen.com/subject/xsbysftx.html