こんにちは。
制作部の山口です。
あと2日で12月です。他の月と同じ1ヶ月間なのに、この月だけは毎年あっという間に過ぎてしまうので、もうなんだか気持ちだけが毎日ソワソワしています。
先日会社から出た課題の中で、Javascriptのレスポンシブ対応を挑戦しました。
それはこんなソースです。
<script>
if(navigator.userAgent.indexOf(‘iPhone’) > 0 || navigator.userAgent.indexOf(‘iPod’) > 0 || (navigator.userAgent.indexOf(‘Android’) > 0 && navigator.userAgent.indexOf(‘Mobile’) > 0)){
// スマホ時に行う処理を書く
} else {
// PC・タブレット時に行う処理を書く
}
</script>
わからないなりにご説明します。
indexOfメソッドは、指定された文字列が現在の文字列に登場する位置を0以上の値で返します。(含まれていない場合には-1を返します。)
今回のソースでは
navigator.userAgent.indexOf(‘iPhone’) > 0 ←iPhoneである
|| ←または
navigator.userAgent.indexOf(‘iPod’) > 0 ←iPodである
|| ←または
navigator.userAgent.indexOf(‘Android’) > 0 && navigator.userAgent.indexOf(‘Mobile’) > 0 ←Androidである時に
// スマホ時に行う処理を書く
} else { ←それ以外の時に
// PC・タブレット時に行う処理を書く
という感じの意味です。
iPhoneやiPodのように、navigator.userAgent.indexOf(‘Android’) > 0 だけだと、Android総称になり、Androidタブレットも含まれるため
navigator.userAgent.indexOf(‘Android’) > 0 && navigator.userAgent.indexOf(‘Mobile’) > 0 となります。
私は、まだ初心者なので、こうして一単語ずつ調べて、ソースの意味を少しずつ理解しています。これからも頑張ろう・・!