ユーザーエージェントによって表示が変わるようにしました~☆
アドレスは同じままで、スマホやガラケーならシンプルな縦長のページ、
タブレットやPCなら並べ変わるページが表示されるように。
追記:
PHPで振り分けたのですが、MTのタグで使える方がいいので後でこちら使ってみます。
http://www.koikikukan.com/archives/2009/05/08-015555.php
php版 以下流し書き
・変数userAgentに端末の種類を入れておく。
<?php $ua = $_SERVER['HTTP_USER_AGENT']; if ((strpos($ua, 'Android') !== false) && (strpos($ua, 'Mobile') !== false) || (strpos($ua, 'iPhone') !== false) || (strpos($ua, 'Windows Phone') !== false)) { $userAgent = 'sp'; } elseif ((strpos($ua, 'Android') !== false) || (strpos($ua, 'iPad')!== false)) { $userAgent = 'tab'; } elseif ((strpos($ua, 'DoCoMo') !== false) || (strpos($ua, 'KDDI') !==false) || (strpos($ua, 'SoftBank') !== false) || (strpos($ua,'Vodafone') !== false) || (strpos($ua, 'J-PHONE') !== false)) { $userAgent = 'mobile'; } else { $userAgent = 'pc'; } ?>
・見やすいswitchで振り分け
・インクルードしたphpから変数userAgentを使う場合は、
先にglobalを使う宣言。
<?php global $userAgent; switch ($userAgent) { case 'mobile': echo 'ガラケー'; break; case 'sp': echo 'スマホ'; break; case 'tab': echo 'タブレット'; break; case 'pc': echo 'PC'; break; } ?>
・実際に使う時
<?php global $userAgent; switch ($userAgent) { case 'mobile': case 'sp': echo 'モバイル用'; break; case 'tab': case 'pc': echo '大きい画面用'; break; } ?>
・複数行のechoにヒアドキュメント
<<<の後にスペース入れたら構文チェックでエラーでたので入れず。EndofanEraの所はなんでもいいとのこと。普通EOM等。
・jQueryの変数の$を開いてしまうので、ヒアドキュメントを'で囲うと動きました。
<?php switch ($userAgent) { case 'tab': case 'pc': echo <<<'EndofanEra' $tiles.infinitescroll({ navSelector : '#page-nav', nextSelector : '#page-nav a', itemSelector : '.article', loading: { msgText: '', finishedMsg: '', } } EndofanEra; break; } ?>
フォローしませんか?