iPad的定位問題meta標籤

Question

起初，我用的meta標籤：

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

在使用這個標籤，在初始加載時，頁面看起來在橫向模式很好，但是當我改變方向爲縱向和背部以橫向模式，頁面縮小。

然後我想我的頁面上的以下meta標籤：

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

雖然頁面在橫向模式適合，我沒有看到一個滾動條來查看在肖像模式更多的內容。

我是否需要使用媒體查詢來使頁面適合橫向和縱向模式，還是有一個元標記可以幫助實現這一目標？

Answer 1

我找到了一個很好的解決了這一點：

Meta標籤：

<meta name="viewport" id="viewport" content="width=device-width,minimum- scale=1.0,maximum-scale=10.0,initial-scale=1.0" /> 

JavaScript的使用jQuery：

var mobile_timer = false; 
if(navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) { 
$('#viewport').attr('content','width=device-width,minimum-scale=1.0,maximum-  scale=1.0,initial-scale=1.0'); 
$(window).bind('gesturestart',function() { 
    clearTimeout(mobile_timer); 
    $('#viewport').attr('content','width=device-width,minimum-scale=1.0,maximum-scale=10.0'); 
}).bind('touchend',function() { 
    clearTimeout(mobile_timer); 
    mobile_timer = setTimeout(function() { 
     $('#viewport').attr('content','width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0'); 
    },1000); 
}); 
} 

劇本基本上不允許在iPhone上，除非檢測手勢縮放，只是在你的HTML中證明它，你應該很好走;） 來源：http://www.ternstyle.us/blog/reset-iphone-zoom-on-orientation-change-to-landscape

我還爲iPhone手機

@media screen and (max-device-width: 480px) 
{ 
    html 
    { 
     -webkit-text-size-adjust: none; 
    } 
}