JavaScriptとPhoneGap Buildで作るスマートフォンゲームアプリ

スタート画面への自動遷移

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
スプラッシュスクリーンを表示後、スタート画面へ自動的に遷移させる方法について解説致します。
講師:
03:46

字幕

このレッスンでは スプラッシュスクリーンを表示後 スタート画面に自動的に 遷移させる方法について解説いたします まずは ダウンロードしてきた startscreen というフォルダに入っている js フォルダ内の script.js ファイルを エディタで開いてください そして これがそのファイルを開いた状態です このファイルを使って今回のレッスンの解説を 進めていきたいと思います それでは 早速レッスンを始めていきましょう それでは まず前回のレッスンのおさらいです 前回のレッスンはこちらの部分で スプラッシュスクリーンの表示を行いましたね 今回は そのスプラッシュスクリーンを表示後 一定時間後にスタート画面に表示を切り替える 方法について見てきたいと思います それがこちらの部分となります それでは順番に見ていきましょう まずは setTimeoutと書いて ここ(function ( ) { } そして カンマと書いて 3000 と書きます そして ); で処理を終えています この setTimeout というのは この function の後の 波括弧の間に書かれたこちらの処理を ここに記述した時間の後に 一度だけ自動的に 実行するといった意味になります ここの時間は ミリ秒の単位で記載しています ですので 今回は3秒という形になります 要するにスプラッシュスクリーンを表示して 3秒経ったら自動的に こちらの処理を実行するといった形になります では その処理を見ていきます まず$('#pageSplash').fadeOut と書いていますね こうすることで このスプラッシュスクリーンを フェードアウトさせることが可能です そして その後の括弧の中に書かれている こちらの 3000 ですが こちらも同じように時間を意味しています ここでは3秒かけて フェードアウトするといった意味になります そして その後にまた function と書いて { } となっていますね これは こちらの フェードアウトの処理が終わったら こちらの内容を実行しろという形になります そして フェードアウトが終わった後に 実行する内容は それは まさしくスタート画面の表示ですね $ の ('#pageStart').show( ); と書きます このようにすることで IDpageStart がついた html タグのコンテンツを 表示することができます これでスプラッシュスクリーンから スタート画面への自動遷移は完了となります それでは index.html ファイルを ブラウザで開いて確認してみましょう index.html は先ほどダウンロードしてきた ファイルの中に含まれています こちらのファイルですね こちらのファイルをブラウザで開きます すると このように スプラッシュスクリーンが表示されてきて そしてフェードアウトして その後に スタート画面が表示されてきましたね このように表示されてくれば きちんとプログラムの実装が完了 できているといった形になります 以上でレッスンは終了です 今回はスプラッシュスクリーンを表示後 スタート画面へ自動的に 遷移させる方法について解説いたしました 以降のレッスンではスタートボタンに クリックイベントを登録して クリックした後にゲームプレイ画面に 遷移させる方法について解説いたしますので そちらもあわせてご覧ください

JavaScriptとPhoneGap Buildで作るスマートフォンゲームアプリ

このコースでは、JavaScriptとPhoneGap Buildを使ってスマートフォン向けのもぐらたたきゲームのアプリを作成する方法について解説します。Phonegap BuildやjQueryについて紹介したのち、HTMLやCSSでのコーディングの方法、ゲーム内でのアニメーションの実装や条件分岐の方法などについて学んでいきます。

2時間27分 (43 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2015年05月12日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。