まーさかJavascriptのことを書くことになろうとは(;・∀・)
いや、そんな詳しくないんすよJavascript(;・∀・)
いや、詳しくないからこその備忘録といえる!!(`・ω・´)
さて、現在進めている仕事で、
アクセスしてくれるデバイスのサイズによって、
処理を変更する必要性が出てきました。
元々お客さんのご要望で実装した機能が、
パソからのアクセスだとちゃんと動いてくれるのですが、
スマホからだと不具合が起きまくるのです(´・ω・`)
だもんで、スマホの方はもう機能を切ってしまえと思いまして。
んでその機能はJavascriptで実装していたので、
ついでにデバイスのサイズで読み込むか読み込まないかを振り分けようってことです。
色々試行錯誤した結果、以下のようなコードに落ち着きました。
jQuery(document).ready(function($) { //PC環境の場合 if(window.matchMedia( '(min-width: 600px)' ).matches) { //切り替える画面サイズ window.alert("こっちはパソコンの時の処理だよッ!!"); } else{//スマホ環境の場合 window.alert("こっちはスマホの時の処理さッ!!"); } });
こんな感じ。
分かりやすく処理内容はwindow.alertにしておきましたが、
実際には必要な処理にしておいてくださいまし。
あ、ちなみに見てお分かりの通りjQueryを使ってますので、
利用されるときは事前にjQueryを読み込んでおいてください。
Wordpressだと最近のテーマはほぼほぼjQueryを読み込んでるらしいですし、
そうでなければgoogle apiとかから読みこめば大丈夫でしょう。
あと、htmlのヘッダーの中に直接書き込むときは、
<script type=”javascript”></script>で挟んであげてください。
おれすぐ忘れちゃう(;・∀・)
しかし眠い……そしてケツと腰がいたいのです……(;・∀・)