0

Google Chromeブラウザーエミュレーターを介して、私のWebサイトはiPhone5用に正しくフォーマットされています。これは、Visual Studioを介して行われたのではなく、Chromeブラウザを使用してサイトwww.yeagertech.comにアクセスするだけで行われたことに注意してください。

右上のログオンの資格情報は次のとおりです。ユーザー名：stageadmin電子メールアドレス：wsyeager36@msn.comパスワード：1234567

iPhone5自体から直接サイトにアクセスしようとすると、デスクトップブラウザのようにフォーマットされたままになります。エミュレーターではなく、電話自体から直接サイトを表示した場合、Android電話とWindowsPhoneでも同じことが起こります。

誰かがフォーマットを正しくするために私が他に何をする必要があるかについて何か考えを持っていますか？

Global.asaxファイルには、必要なものがすべて含まれています。

protected void Application_Start()
        {
            DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("windowsphone")
            {
                ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf
                    ("windowsphone", StringComparison.OrdinalIgnoreCase) >= 0)
            });

            DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("iPhone")
            {
                ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf
                    ("iPhone", StringComparison.OrdinalIgnoreCase) >= 0)
            });

            DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("Android")
            {
                ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf
                    ("Android", StringComparison.OrdinalIgnoreCase) >= 0)
            });

            DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("iPad")
            {
                ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf
                    ("iPad", StringComparison.OrdinalIgnoreCase) >= 0)
            });

            AreaRegistration.RegisterAllAreas();

            RegisterGlobalFilters(GlobalFilters.Filters);
            RegisterRoutes(RouteTable.Routes);
        }
4

1 に答える 1

0

iPhone 5 では、以前の Retina デバイスと同じ 326 ピクセル/インチ (ppi) で、画面解像度が 1,136 x 640 ピクセルに増加しました。iPhone は自動的にビューポートを 980 ピクセルに合わせてスケーリングするため、変更を加えることなくほとんどの Web ページでうまく機能します。モバイル サイト用に iPhone のデフォルトの画面サイズを具体的にターゲットにしたい場合は、レイアウトの head に次のメタタグを追加できます: Safari ビューポート リファレンス<meta name="viewport" content="initial-scale=1.0"> を参照してください。

Opera Mobile Emulator - http://www.opera.com/developer/tools/mobile/を使用して、Android で発生することを再現できます。また、いくつかのブレークポイントを Global.asax.cs に配置し、ユーザー エージェントから期待される結果が得られていることを確認します。

また、デバイス固有の各ビューにデバッグ コードを追加して、期待されるビューが各デバイスでレンダリングされていることを確認することもお勧めします。

レンダリングを確認する前に、JS エラーを修正する必要があります。JQuery がロードされる前に jquery ライブラリをロードしています。最初にそれを修正します。次に、iPhone 5 は 4 インチの画面で @ 640px x 1136px をレンダリングすることに注意してください。Galaxy S-III は 720 ピクセルの幅を少し大きな画面にレンダリングします。これは、多くの開発者にとって問題の原因となります。クイック スタートとして、デフォルトのデスクトップとモバイルの DisplayModes に戻って、Bootstrap を参照することをお勧めします - http://twitter.github.com/bootstrap/index.html - Bootstrap は、レスポンシブ デザインの優れたクイック スタートです。

于 2012-12-15T20:07:33.053 に答える