ホームページの作成や運用ノウハウについて、プロのクリエイターが情報を無料公開!

ホームページTIPS
facebook twitter mail

このサイトはコーディング初心者〜中級者向けの情報サイトです。掲載コードの転用制限はありませんが、
動作保証は行なっておりません。ご意見については、フォームからお知らせください。

javascriptに関するTips

更新日:2017.10.4

スマートフォンとPC / タブレットで処理を振り分けるjavasript

解 説

スライダーやスムーズスクロール、ボタンクリックで開くウィンドウなどホームページに様々な動きがつけられるjavascript( jQquery )をPC/タブレットの時だけ発動させたり、スマートフォンの時だけ発動させる条件分岐の書き方をご紹介します。

1ウィンドウ幅によって振り分ける方法
//ウィンドウ幅が767px以下の時に発動


  jQuery(document).ready(function() {
      var w = $(window).width();
      var x = 767;				//767px以下(スマートフォン閲覧時)で発動
      if (w <= x) {


   /*ここに処理内容を書く*/


       }
   });
2ユーザーエージェント( 使用デバイス )を判別して振り分ける方法
//iPhone、iPad、アンドロイド端末の場合に発動


    jQuery(function(){
        var device = navigator.userAgent;
        if((device.indexOf('iPhone') > 0 && device.indexOf('iPad') == -1) || device.indexOf('iPod') > 0 || device.indexOf('Android') > 0){
           

     /*ここに処理内容を書く*/


        }
    });

トップへ