LoginSignup
1
2

More than 5 years have passed since last update.

Flash/CreateJSコンテンツを切り替え表示する方法

Posted at

Flash/CreateJSコンテンツを切り替え表示する方法
http://www.adobe.com/jp/devnet/createjs/articles/flash_createjs_01.html

Flash再生可否をチェックし、再生可能ならFlashを表示、そうでなければCreateJS表示

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Flash/CreateJSコンテンツの表示切り替え</title>

<script src="src/jquery-1.7.1.min.js"></script>
<script src="src/SWFObject-1.1.1.min.js"></script>

<script>

$(document).ready(function(){
  /* Flash再生可否をチェックし、再生可能ならFlashを表示、そうでなければCreateJS表示
   * 表示する位置は、body内のid:gameのdiv直下
   */
  if($.flash.available){
    addFlash();
  }else{
    addCJS();
  }

  //Flashを表示する関数
  function addFlash(){
    $('#game').flash({swf:'game.swf',width:550,height:400});
  }

  //CreateJSのライブラリを読み込み、表示する関数
  function addCJS(){
    //ステージとなるCanvas配置
    $("#game").append(
      '<canvas id="canvas" width="550" height="400"></canvas>'
    );

    /* 読み込みライブラリのリスト。この順番に同期処理で読み込みます。
     * Toolkit for CreateJSから書き出されるjsファイルや、ゲーム用のjsファイルは、
     * CreateJSのクラスを利用しているので、CreateJSの各種ライブラリ読み込み後に読み込むようにします。
     */
    var libQueue = [
      "libs/easeljs-0.5.0.min.js",
      "libs/tweenjs-0.3.0.min.js",
      "libs/movieclip-0.5.0.min.js",
      "libs/preloadjs-0.2.0.min.js",
      "libs/soundjs-0.3.0.min.js",
      "GameData.js",
      "game.js"
    ];

    //ライブラリ読み込み用のヘルパ
    function loadQueue(){
      $.ajax({
        url:libQueue.shift(),
        dataType:"script",
        async:false,
        success:function(data){
          if(libQueue.length==0){
            //全てのライブラリを読み込んだ際に実行する関数を指定。今回は「init」を実行
            init();
          }else{
            loadQueue();
          }
        }
      });
    }
    //読み込み開始
    loadQueue();

  }
});


</script>

</head>

<body bgcolor="#F0F0F0">
  <p>
    Flash再生可否をチェックし、再生可能ならFlashを表示、そうでなければCreateJS表示します。<br>
    表示する位置は、body内のid:gameのdiv直下です。
  </p>

  <div id="game"></div>

</body>

</html>
1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
2