Question

我想改变我的视口：

<meta name="viewport" content="user-scalable=no">

要：

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

基于设备屏幕。第一个例子适用于iPad，但在iPhone上我有一个响应样式表，我想开始。

我已经尝试过这段代码，我已经从这个问题进行了修改。 changing viewport based on device resolution

// Check for iPhone screen size
if($.mobile.media("screen and (min-width: 320px)")) {
    // Change viewport for smaller devices
    $('meta[name=viewport]').attr('content','width=device-width, initial-scale=1');
}

Answer 1

我明白了。问题在于我的媒体查询。它应该是max-device-width，而不是min-width或max-width。

// Check for device screen size
if($.mobile.media("screen and (max-device-width: 480px)")) {
    // Change viewport for smaller devices
    $('meta[name=viewport]').attr('content','width=device-width, initial-scale=1');
}

根据jQuery Mobile中的设备/屏幕分辨率更改元视口

1 个答案: