CreateJSのTweenJS、SoundJS

TweenJS基础实例：

var canvas = document.getElementById(‘myCanvas‘),
    stage = new createjs.Stage(canvas);

var stageWidth = canvas.width;
var stageHeight = canvas.height;

var characterWidth = 75;
var characterHeight = 96;

var spritesheet;
var charactor;

window.onload = function(){

  spritesheet = new createjs.SpriteSheet({
    ‘images‘: [‘http://cdn.gbtags.com/gblibraryassets/libid108/charactor.png‘],
    ‘frames‘: {"height": 96, "count": 10, "width": 75}
  });

  charactor  = new createjs.Sprite(spritesheet);
  charactor.x = (stageWidth - characterWidth)/2;
  charactor.y = (stageHeight - characterHeight)/2;

  stage.addChild(charactor);

  charactor.play();

  /*
   *  以下代码生成了tween动画人物相关效果
   */

  // 生成上下移动人物效果（一次性）
  createjs.Tween.get(charactor, {loop:false})
      .to({y:150}, 500, createjs.Ease.quadInOut)
      .to({y:50}, 500, createjs.Ease.quadInOut);

  // 生成人物左右移动效果（无限循环）
  createjs.Tween.get(charactor, {loop:true})
      .wait(3000)
      .call(charactor.gotoAndStop, [5], charactor)
      .wait(300)
      .to({x:450}, 1200, createjs.Ease.backInOut)
      .call(charactor.gotoAndStop, [0], charactor)
      .wait(2000)
      .call(charactor.gotoAndStop, [5], charactor)
      .wait(300)
      .to({x:(stageWidth - characterWidth)/2}, 500, createjs.Ease.backInOut)
      .call(charactor.gotoAndStop, [0], charactor);

  createjs.Ticker.setFPS(35);
  createjs.Ticker.addEventListener("tick", tick);

  function tick(){
    stage.update();
  }
};

SoundJS播放音频

createjs.Sound.alternateExtensions = [‘mp3‘];
createjs.Sound.on(‘fileload‘, this.loadHandler, this);
createjs.Sound.registerSound(‘endless.mp3‘, ‘sound‘);

function loadHandler(event) {
     // 这会引发针对每个已注册的声音
     var instance = createjs.Sound.play(‘sound‘);
     instance.on(‘complete‘, this.handleComplete, this);
     instance.volume = 0.5
}