スマホメニュー

PHPで画面サイズを判断して分岐したかったので、Jsで取得した画面の横幅を、sessionに入れてみた。

HTMLが読み込まれる前に、画面サイズによって、要素にclassを付けたり付けなかったりしたかったので、どうにか出来ないか考えて見ました。
<input type=”hidden”>は使いたくなかったので、別の方法で試行錯誤してますが、言ってしまえばAjaxを使っているだけです。

サンプルコード

▼ JsはjQueryを使ってます。

▼ 上記Jsの「画面サイズを渡すPHP」の中身

簡単な解説

Js部分の説明

Js部分は「windowSize.php」といういファイルに、「$(window).width()」で取得した画面横のサイズをPOSTしています。
また、ウィンドウサイズが変わった時に、session内のサイズを更新したいので、その場合の処理も入れています。

PHP部分の説明

凄くシンプルに、POSTされて来た画面サイズを「$_SESSION[‘windowSize’]」に入れているだけです。

後は、この「session」を使って、HTMLが読み込まれる前にPHP側で画面サイズを擬似的に判断出来るようになります。

注意点

  • 最初の1ページ目には無力。
  • タイミングによっては横幅が正確ではない。
    (例えば、非同期通信中にウィンドウサイズを変更して、すぐページ遷移した時)

注意点1個目は、こればかりは仕方ないような気がするので、HTMLが読み込み終わったタイミングで、Jsで対処するしかないですね。。。

注意点2個目は、これも、実際レアケースなのでとりあえず無視でw
注意点1個目の対処方でお茶を濁すということで。。。

チラシの裏

注意点で上げたように100%完璧には行きませんが、<input type=”hidden”>を使わない方法ではコレが一番しっくり来ています。
<input type=”hidden”>を使っても、注意点1個目は同じだし、注意点2個めが多少マシになる程度ですよね^^;
それよりも、HTMLが汚くなるのが嫌なので、やっぱりこの方法に落ち着きます。

他にもっと良い方法が見つかったり、また別記事で投稿します。
もしくは、良い方法がありましたら教えて頂きたいです。

コメントを残す

メールアドレスが公開されることはありません。

Advertising

最近の記事

アーカイブ

Advertising

Advertising

カレンダー

2017年11月
« 10月    
 1234
567891011
12131415161718
19202122232425
2627282930  

タグ

Social