そのため、次の 3 つのシナリオに従ってロードする必要がある非常に混乱したスクリプトを作成しました。
- デスクトップ
- モバイル
- モバイル フル サイト (モバイルのデスクトップ バージョン)
true の場合は jQuery Mobile とその他のスクリプト ファイルをロードし、false の場合は特にモバイル以外のスクリプト ファイルをロードするモバイル ブラウザー ( http://detectmobilebrowsers.com/を使用) をテストする yepnope 関数がありました。ただし、これらのファイルが Modernizr の上に強制的に読み込まれることに気付きました。つまり、jQuery の前に読み込まれます。
また、ユーザーがデスクトップ バージョンを表示したい場合にのみ、モバイル デバイスから設定できる Cookie もあります。Cookie が設定されている場合、上記のスクリプトは無視されます。
したがって、基本的に、これらの条件を実装するための最良の方法を見つけるのに苦労しています。
すべてのバージョンで、jQuery、一連のライブラリ、メイン スクリプト ファイルが必要です。
デスクトップ バージョン (およびモバイル フル サイト) には、さらに jQuery UI と非モバイル スクリプト ファイルが必要です。
モバイル バージョンには、jQuery Mobile が必要ですが、jQuery UI は必要ありません。また、いくつかの追加のライブラリと、モバイル用のさらに別の特定のスクリプト ファイルも必要です。
jQuery.browser.mobile最初に確認してから、true の場合は Cookie を確認する必要があると思います。問題は、PHP ステートメントをスクリプト条件に挿入する際に問題が発生していたことです。次のようになります。
if(jQuery.browser.mobile) {
if(<?php if($_POST['dontDoMob']) { return true; } ?>) {
// Mobile full site scripts
} else {
// Mobile scripts
}
} else {
// Desktop scripts
}
また、上記のスクリプトは、jQuery をロードする yepnope の完全な機能として実行する必要があると思います。
この状況での正しいテクニックを誰か教えてもらえますか?
余談ですが、jQuery Mobile と jQuery UI を一緒にロードするのは本当に悪い習慣なのでしょうか? 前者は、モバイル プラットフォームで後者を (ある意味で) 複製することを意図したものですか? jQuery UI をロードするのは時間の無駄ですか?
更新（以下のコメントを参照）：
次の手法を使用して、4 種類のデバイス/デバイスの状態を検出することにしました。デスクトップ、電話、タブレット、および電話のデスクトップ サイト (phonefull)。優れたMobile Detect クラスを使用します。
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;
$desktop = false;
$phone = false;
$tablet = false;
$phonefull = false;
$class = '';
if( $detect->isMobile() && !$detect->isTablet() ) {
if($_COOKIE['dontDoMob']) {
$phonefull = true;
$class = 'phonefull';
} else {
$phone = true;
$class = 'phone';
}
} else if( $detect->isTablet() ) {
$tablet = true;
$class = 'tablet';
} else {
$desktop = true;
$class = 'desktop';
}
?>
class変数は、CSS および JavaScript で簡単に使用できるようにタグにエコーされます<body>。
デバイス変数を使用するには、通常の PHP の if ステートメントを実行します。
<link rel="stylesheet" href="css/main.css">
<?php if($phone) { ?>
<link rel="stylesheet" href="css/mobile.css">
<?php } ?>