0

これを行う方法を知る必要があります。

現在、電話（ハンドヘルド）デバイスを使用していないときに、ページを同じページにロードしています。したがって、メディアクエリと同じように、いくつかの条件をテストする必要があります。例: 一部の要素が非表示になっているかどうかをテストしてから、プラグインを呼び出します。

これがページのリダイレクトよりもうまく機能するかどうかはわかりませんが、確認する必要がありますか?

どうやってやるの？

jquery mobile は、小さな画面で使用する場合 (ハンドヘルド) にのみ必要です。メディアクエリは問題なく動作します。私が設定した方法は、ページ上のすべてを非表示にし、モバイル部分のみを表示することです.

@media screen and (max-width: 555px),
screen and (max-device-width: 480px)
{ 
#wrap,#footer,#masker{display:none;}
#p-mobi{ display:block;}
}

と

<div data-role="page" id="p-mobi">

</div>

ありがとう、リチャード

4

1 に答える 1

1

利用可能なオプションはほとんどありません。

あなたのニーズによると、これは最高のものでなければなりません：

  1. https://github.com/borismus/device.js

    これは完全にクライアント側の検出であり、カスタム js スクリプトを作成する必要はありません。このカスタム リンク タグを使用して、目的のデバイス サイズに一致させるだけです。

    例えば：

    <link rel="alternate" href="http://foo.com" id="desktop" media="only screen and (touch-enabled: 0)">
<link rel="alternate" href="http://m.foo.com" id="phone" media="only screen and (max-device-width: 640px)">
<link rel="alternate" href="http://tablet.foo.com" id="tablet" media="only screen and (min-device-width: 641px)">

    詳細はこちら: https://github.com/borismus/device.js

  2. または、このスクリプトを使用してブラウザーの種類を検出し、この js ローダーを使用して使用する js ファイルを決定します。

    例：

    yepnope({
    test : Modernizr.geolocation,
    yep  : 'normal.js',
    nope : ['polyfill.js', 'wrapper.js']
});

    もう 1 つ、yephope.js はそのままでは jQuery と互換性がないため、少し修正する必要があります。

私のアドバイスは、オプション 1 に固執することです。

于 2013-01-04T20:51:46.233 に答える