2

jQuery Mobile UIを使用してモバイルサイトを構築しましたが、デスクトップサイトとは異なる機能が必要であることに気付きました(デスクトップサイトではナツメヤシの日付を長くする必要があります)。

私はModernizrとmatchMediaを調べて、別々のjsファイルをロードするのを手伝ってくれましたが、それが応答して機能するための良い方法を見つけることができません。Modernizrは、初期ロードでのみ機能し(ドキュメントで何かを見逃していない限り)、最小/最大幅のしきい値を超えると、matchMediaが複数回実行されるという問題が発生します。時々動作しますが、問題は個別のjsファイルを追加/削除することです。その上(大きな問題ではありません-私は思いません)、Chromeは別のスクリプトからDOMにスクリプトをロードするときにエラーを発生させます。

1つのjsファイルを作成して$.mobile.media("screen and (min-width: XXXpx)")から、本体の幅などのリスナーを追加して、必要な値を変更するのが最善でしょうか。

HTTPリクエストとサイトのサイズをできるだけ小さくしようとしているため、これを自分で難しくしている、または明らかな何かを見逃している可能性がありますが、これに対する適切な解決策を見つけることができません。

ありがとうございました!

ライトニングラウンドボーナス質問data-role data-id data-theme:デスクトップサイトに切り替えた後、すべてのjQuery Mobileスタイリング()を維持することは良い習慣/適切ですか?それはひどく見えます..大きな画面でしか見ない人にとってはひどいです。

4

1 に答える 1

1

IMHO、最善のアプローチは、「isMobile」、「isTablet」、「isDesktop」など、Webアプリの「pageinit」イベントにアタッチされたメソッド内に設定されるいくつかのフラグをJavaScriptに導入することです。後で、そのフラグをチェックして、コードの特定の部分の適切なバージョンに応じて動作するようにすることができます。

フラグを確認する方法は、アーキテクチャによって異なります。私が現在取り組んでいるプロジェクトでは、ページの本文のバックエンドによってアタッチされたクラスからその情報を抽出しますが、それはその情報があるためです。Harveyのようなライブラリを使用して、トリガーされるメディアクエリを監視し、それに応じてフラグを設定することができます。あなたの選択肢がここで終わるとは思いませんが、私はあなたをこれ以上助けることができないのではないかと思います!

于 2012-10-02T18:01:50.440 に答える