【问题标题】:Mobile devices - Override viewport scale settings to implement a zoom/pan media viewer?移动设备 - 覆盖视口比例设置以实现缩放/平移媒体查看器?
【发布时间】:2013-02-20 07:37:23
【问题描述】:

我有一个带有固定标题的响应式布局。当通过视口元标记启用缩放(缩放)时,布局可能会在用户缩放时中断,因为标题也会缩放 - 这是不好的。 (我希望无论当前的比例设置是什么,我都可以只保留标题而不进行缩放)。无论如何,这就是我使用以下禁用缩放的元标记的原因:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

我的目标是实现某种媒体查看器,例如 Facebook,它会覆盖文档的视口设置。关闭后,它应该将一切恢复正常。我尝试打开一个加载可缩放文档的 iframe,但似乎父文档覆盖了 iframe。

仅供参考,我正在使用 jquery。

【问题讨论】:

    标签: javascript ios safari scaling viewport


    【解决方案1】:

    刚刚发现使用 jQuery 可以做到这一点:

    var meta = $('meta[name=viewport]');
    $(meta).attr('content', 'device-width, initial-scale=1, maximum-scale=5');
    

    我可以变得更花哨...比如先获取原始设置,然后在完成后恢复它。我在 iOS 6 上对此进行了测试,并且可以正常工作。我没有在其他设备上测试过。

    【讨论】:

    • 太棒了!我在 iPad 应用程序中有一个小的网络视图,需要覆盖设备宽度,这很完美:[theWebView stringByEvaluatingJavaScriptFromString: @"var meta = $('meta[name=viewport]'); $(meta).attr('content', 'width=320, initial-scale=1, maximum-scale=5')"];
    猜你喜欢
    • 2020-03-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-07-09
    • 2014-12-25
    • 2012-10-02
    • 1970-01-01
    • 2020-06-06
    相关资源
    最近更新 更多