zoukankan      html  css  js  c++  java
  • 防止手机浏览点击输入框自动放大

    1、设置meta属性

    <meta content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width" name="viewport">

    content属性值 :

      width:可视区域的宽度,值可为数字或关键词device-width;

      height:同width;

      intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放;

      maximum-scale=1.0, minimum-scale=1.0:可视区域的缩放级别,maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上;

      user-scalable:是否可对页面进行缩放,no 禁止缩放。

    2、苹果为了提高Safari中网站的辅助功能,屏蔽了Meta下的user-scalable=no功能。所以在iOS10下面,就算加上user-scalable=no,Safari浏览器也能支持手动缩放。所以只能用js加监听事件来阻止手动缩放。

    window.onload=function () {  
            document.addEventListener('touchstart',function (event) {  
                if(event.touches.length>1){  
                    event.preventDefault();  
                }  
            })  
            var lastTouchEnd=0;  
            document.addEventListener('touchend',function (event) {  
                var now=(new Date()).getTime();  
                if(now-lastTouchEnd<=300){  
                    event.preventDefault();  
                }  
                lastTouchEnd=now;  
            },false)  
        } 
  • 相关阅读:
    查看java代码,命令,ctrl+r
    JVM调优
    springboot线程池
    jpa
    复制java对象,jpa,save
    springboot添加切面
    gunicorn 实现 gevent 多线程
    经典算法
    python-生僻字转拼音
    HTML介绍
  • 原文地址:https://www.cnblogs.com/ilovexiaoming/p/6897821.html
Copyright © 2011-2022 走看看