精华内容
下载资源
问答
  • 可能大家发现自己制作的手机页面,默认打开的时候并不是在理想的缩放状态下。 遇到这样的问题,需要在head标签下,添加meta解决。 代码如下: <meta name=”viewport” content=”width=device-width; initial...
  • 不幸的是,每个浏览器都有自己的视口元标记实现。不同的组合将在不同的浏览器上工作。Android 2.2:似乎根本不...要允许浏览器缩放内容,您需要设置user-scalable = yes,然后要禁用缩放,可以将最小和最大缩放比...

    不幸的是,每个浏览器都有自己的视口元标记实现。不同的组合将在不同的浏览器上工作。

    Android 2.2:似乎根本不支持视口元标记。

    Android 2.3.x / 3.x:通过设置user-scalable = no,您也可以自己禁用视口meta标签的缩放。这可能就是您的宽度选项无效的原因。要允许浏览器缩放内容,您需要设置user-scalable = yes,然后要禁用缩放,可以将最小和最大缩放比例设置为相同的值,以使其不会缩小或增长。以最初的比例进行玩具,直到您的站点贴合为止。

    Android 4.x:与2.3.x相同的规则适用,只是不再遵守最小和最大比例,如果您使用user-scalable = yes,则用户始终可以缩放,将其设置为“ no”意味着您自己的比例将被忽略,这就是我现在面临的问题,这使我陷入了这个问题。您似乎无法在4.x中同时禁用缩放功能。

    iOS / Safari(已测试4.x / 5.x):缩放按预期工作,您可以使用user-scalable = 0禁用缩放(关键字yes / no在4.x中不起作用)。iOS / Safari也没有target-densitydpi的概念,因此您应该避免使用它来避免错误。您不需要最小值和最大值,因为您可以按预期的方式关闭缩放。仅使用宽度,否则会遇到iOS定向错误

    Chrome:缩放比例像在iOS中一样按预期工作,最小和最大均受尊重,您可以使用user-scalable = no来关闭缩放。

    结论:在检测到一些基本的浏览器/设备之后,您可以使用一些相当简单的JS来相应地设置内容。我知道这种检测方法是不受欢迎的,但是在这种情况下,这几乎是不可避免的,因为每个供应商都已经去做自己的事!希望这对帮助视口的人们有所帮助,如果有人可以在不使用视口的情况下禁用Android 4.x缩放功能,请告诉我。

    [编辑]

    Android 4.x Chrome浏览器(我认为大多数国家/地区已预装):您可以确保用户无法缩放并且页面为全屏。缺点:您必须确保内容具有固定的宽度。我尚未在较低的Android版本上对此进行过测试。为此,请参见示例:

    [编辑2]

    iOS / Safari 7.1:自v7.1起,Apple为视口元标记引入了一个新标记minimal-ui。为了协助全屏应用程序,这会隐藏地址栏和底部工具栏,以提供全屏体验(不是全屏API,而是关闭且不需要用户接受)。它的确带有很多错误,并且在iPad中不起作用。

    [编辑3]

    iOS / Safari 8 Beta 4:minimal-ui在此版本中,Apple现在已删除了EDIT 2中提到的视口元标记。来源-WebKit注释

    展开全文
  • 前几天我做了一个bs的项目,在安卓手机上面用户是无法缩放的。但是在ios手机自带的safari浏览器上是可以缩放的,怎么解决的呢 通过我的各种搜索 终于找到了解决办法 window.onload = function() { // 阻止双击...

    **

    前几天我做了一个bs的项目,在安卓的手机上面用户是可以禁止缩放的。但是在ios手机自带的safari浏览器上是可以缩放的,怎么解决的呢 通过我的各种搜索 终于找到了解决办法

    **

    window.onload = function() {
        // 阻止双击放大
        var lastTouchEnd = 0;
        document.addEventListener('touchstart', function(event) {
            if (event.touches.length > 1) {
                event.preventDefault();
            }
        });
        document.addEventListener('touchend', function(event) {
            var now = (new Date()).getTime();
            if (now - lastTouchEnd <= 300) {
                event.preventDefault();
            }
            lastTouchEnd = now;
        }, false);
    	// 网上很多都是只有上面的代码 这只能解决双击缩放 是解决不掉所有问题的
        // 在 iOS 里有一组双指手势操作的事件:gesturestart、gesturechange、gestureend
        // 再加入以下代码就可以解决问题了
        document.addEventListener('gesturestart', function(event) {
            event.preventDefault();
        });
    }
    

    希望能帮助到各位小伙伴哦~~~

    展开全文
  • 禁止浏览器缩放网页的HTML代码

    热门讨论 2013-03-30 21:41:52
    这是一个禁止浏览器缩放网页的HTML代码,主要用于手机浏览器,防止用户缩放导致排版错轮用的!
  • 禁止在手机浏览器缩放

    万次阅读 2013-06-14 17:33:57
    页面head中加入禁止缩放
    在页面head中加入<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />禁止缩放
    展开全文
  • 不幸的是,每个浏览器都有自己的视口元标记实现。 不同的组合将在不同的浏览器上工作。Android 2.2:似乎根本不支持视口... 要允许浏览器缩放内容,您需要设置user-scaleable = yes,然后要禁用缩放,可以将最小和最...

    不幸的是,每个浏览器都有自己的视口元标记实现。 不同的组合将在不同的浏览器上工作。

    Android 2.2:似乎根本不支持视口元标记。

    Android 2.3.x / 3.x:通过设置user-scalable = no,您也可以自己禁用视口meta标签的缩放。 这可能就是您的宽度选项无效的原因。 要允许浏览器缩放内容,您需要设置user-scaleable = yes,然后要禁用缩放,可以将最小和最大缩放设置为相同的值,以使其不会缩小或增长。 以最初的比例开始玩具,直到您的站点适合为止。

    Android 4.x:除了不再遵守最小和最大比例之外,其他规则与2.3.x相同,并且如果您使用user-scalable = yes,则用户始终可以缩放,将其设置为“ no”意味着您自己的比例将被忽略, 这就是我现在所面临的问题,这使我想到了这个问题...您似乎无法在4.x中同时禁用缩放功能。

    iOS / Safari(已测试4.x / 5.x):缩放比例可以正常使用,您可以使用user-scalable = 0禁用缩放(关键字yes / no在4.x中不起作用)。 iOS / Safari也没有target-densitydpi的概念,因此您应该避免使用它来避免错误。 您不需要最小值和最大值,因为您可以按预期的方式关闭缩放。 仅使用宽度,否则会遇到iOS定向错误

    Chrome:缩放比例可以像在iOS中那样按预期方式工作,最小和最大均受尊重,您可以使用user-scalable = no关闭缩放。

    结论:在检测到一些基本的浏览器/设备之后,您可以使用一些相当简单的JS来相应地设置内容。 我知道这种检测方法是不受欢迎的,但是在这种情况下,这几乎是不可避免的,因为每个供应商都已经去做自己的事! 希望这可以帮助人们与视口作斗争,如果有人有在不使用视口的情况下禁用Android 4.x缩放的解决方案,请告诉我。

    [编辑]

    Android 4.x Chrome浏览器(我认为大多数国家/地区已预装):您可以确保用户无法缩放并且页面为全屏。 缺点:您必须确保内容具有固定的宽度。 我尚未在较低的Android版本上对此进行过测试。 为此,请参见示例:

    [编辑2]

    iOS / Safari 7.1:自v7.1起,Apple为视口元标记引入了一个新标记,称为minimal-ui。为协助全屏应用程序,这隐藏了地址栏和底部工具栏,以提供全屏体验(不是完全全屏) API,但已关闭,不需要用户接受)。 它的确带有很多错误,并且在iPad中不起作用。

    [编辑3]

    iOS / Safari 8 Beta 4:在此版本中,Apple现在已删除了EDIT 2中提到的视口元标记minimal-ui。 来源-WebKit注释

    展开全文
  • 小米电视、iphone手机安卓手机等控制浏览器默认缩放大小的方法 小米电视2S,安装了一个猎豹浏览器,电视的默认分辨率是1920*1080,外接输入的话可以达到4K,但在显示网页的时候,全屏的最大分辨率只有960 * ...
  • 六款安卓手机浏览器横评 网页浏览效果对比一刚刚我们对比了六款手机浏览器的网页加载速度,接下来我们来看看另一个会影响用户体验的特性——网页的浏览效果。Opera miniOpera mini会以缩放形式打开www网页,双击网页...
  • 手机浏览网页页面缩放

    千次阅读 2017-12-11 11:40:51
    即用户是否能改变页面缩放程度。如果设置为yes则是允许用户对其进行改变,反之为no。默认值是yes。如果你将其设置为no,那么minimum-scale 和 maximum-scale都将被忽略,因为根本不可能缩放。 所有的缩放值都必须...
  • 对于手机端来说,有时候h5界面是要禁止放大和缩小的。 那么如何解决这个问题呢,话不多说,我们...PS:如果手机端使用的是uc浏览器,那么出现这种问题不是你的错——uc自带缩放功能(经过多次测试,确实如此)。
  • 经常遇到JSP网页需要适配手机设备的尺寸问题解决:在JSP加入content属性值 :...可视区域的缩放级别实现了适应手机页面,主要是设置了width为device-width,device-width为使用设备的宽度。REF:网页布局的原则一....
  • 禁止IOS系统Safari浏览器缩放网页

    千次阅读 2019-07-17 08:10:29
    前言 在移动端如何禁止浏览器缩放网页?...仅仅在部分安卓浏览器可以生效,IOS的Safari浏览器无法禁止缩放 禁止缩放(添加 meta 标签并阻止一些事件的默认行为) 安卓和IOS的浏览器都可以生效 代码 禁止缩放(...
  • 禁止手机浏览器放大缩小页面

    千次阅读 2013-06-03 16:10:49
    在head之间加上这个标签。
  • 但是现在,追求个性的你有了另一个不错的选择,这就是今天要推荐的Android浏览器Zirco-browser。   相对于海豚浏览器来说,Zirco是一个比较小众的浏览器,用户量可能微乎其微,但是经过使用测试,个人认为这是一...
  • 今天,我们针对市面上三款最热门的Android手机浏览器(Opera-mini5.1/UCWEB7.2/手机QQ浏览器1.0)做详细对比测试,测试平台为android2.1。具体测试结果如下:(注:四星为优秀,三星为良好,两星为一般)一...
  • MobileWeb_浏览器自动缩放控制

    千次阅读 2011-10-27 08:43:21
    目的 针对 iPhone 和 Android浏览器...我们希望页面能按照原样呈现,而不被浏览器自动缩放。 方法 在html 或jsp 文件上添加: meta是用来在HTML文档中模拟HTTP协议的响应头报文. 解析 width - viewport的宽度
  • 1、当在css中加入下面样式,会导致页面无法正常上下滑动 // css 文件 { touch-action: none; } 这行代码后,会导致页面无法正常上下...当触控事件发生在元素上时,由浏览器来决定进行哪些操作,比如对viewport进...
  • 通过云架构的压缩和转码,欧朋手机浏览器可大大减少页面访问的流量——最高可达90%,让您在手机畅游互联网时无“流量”之忧。 10、超强浏览功能 强大内核,真彩浏览 采用世界领先的浏览器内核,全面支持手机WAP以及...
  • 反正我当时就是在这个上面出现问题,导致当前华为Noto10手机页面无法正常滑动 1、当在css中加入下面样式,会导致页面无法正常上下滑动 // css 文件 { touch-action: none; } 解决办法:修改为默认值{ touch-...
  • 解决手机浏览器上input 输入框导致页面放大的问题(记录)
  • 百度手机浏览器Android版公测(腾讯科技配图)腾讯科技讯(乐天)6月15日消息,经过一个多月的内测,百度手机浏览器Android今日正式上线公测,百度方面称这一版本不同于绝大多数Android手机浏览器直接调用系统自带的内核...
  • Write By Monkeyfly 以下内容均为原创,如需转载请注明出处。 前提 今天下午在JS前端群里有人问了一个问题: ...在微信浏览器中,window.location.href这个跳转方法不能用吗?...在安卓手机上的浏览器可以...
  • if (/Android (\d+\.\d+)/.test(ua)) { var version = parseFloat(RegExp.$1); // andriod 2.3 if (version > 2.3) { $("head").append(' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-...
  • 配置webview缩放参数值: //设置true,才能让Webivew支持<meta>标签的viewport属性 webSettings.setUseWideViewPort(true); //设置可以支持缩放 webSettings.setSupportZoom(true); //设置出现缩放工具 ...
  • 于是一款好用的手机浏览器就成了基本配备。操作流畅,界面友好,节省流量等等都成了我们挑选浏览器的条件。其实系统自带的浏览器其实也并不是特别差劲,只是在用户体验和流量耗费方面做的不够好,而且用智能机的乐趣...
  • 页面中加入代码: , initial-scale=1"> 这样手机访问就自适应屏幕了。不支持IE8以及低于IE8的浏览器。viewport 语法介绍: content=" height = [pixel_value | device-height]
  • 随着HTML5、Canvas、WGL等技术的发展,手机网页的显示效果已经今非昔比,以前在客户端才可以做到的很多事情,实际上已经可以在浏览器上实现。于是浏览器厂商们纷纷抛出WebAPP代替论,关于webAPP能否代替本地APP的...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 16,398
精华内容 6,559
关键字:

安卓手机浏览器页面缩放