2013-06-27 13 views
6

私はnewbieで、phonegap & jquery mobileを使ってハイブリッドアプリケーションを開発しています。私のアプリケーションはmdpiデバイスで正常に見えます。しかし、アプリケーションUIはHDPI & XHDPI電話機、タブレット&アップルデバイスでは小さく見えます。私のphonegapアプリケーションは、Android HD携帯電話、HDPIおよびXHDPI電話では小さく見えます。

現在

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, target-densityDpi=device-dpi" /> 

としてビューポートメタタグを使用していますどのように私は、すべての画面解像度&のDPIで同じUIをacheieveすることができます。

提案が必要です。

答えて

11

target-densityDpi = device-dpiを削除します。これは基本的にはあなたが必要とするものです:

<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1, width=device-width" /> 
+0

もしデバイス-dpiを削除すると、mdpiがデフォルト値として&mdpiデバイスで正常に見えます。しかし、hdpiとxhdpiの画面では、okと思われます。私は他のDPIをサポートするためにCSSで変更を加えなければなりません。それはすべてのアンドロイドとアイオスデバイスをターゲットにする正しいアプローチですか? – yokks

+1

はい、target-densitydpiはほとんどのブラウザで廃止予定です。ほとんどの場合、それは問題ありません。一般的なプラクティスは、リンクタグのメディアクエリを使用して、さまざまなデバイス解像度とデバイスピクセル比を上書きする方法です。ハイアールを本当にサポートする必要がある場合は、次を参照してください。http://coding.smashingmagazine.com/2012/08/20/towards-retina-web/ – Noogen

関連する問題