【enchant.js】Spriteの透過度を変更する

透過度はCSSのプロパティopacityで操作する。

スプライトオブジェクト._element.style.opacity

1.0で不透過
0.0で透過

enchant();

window.onload = function() {
    var game = new Game(320, 320);
    game.fps = 15;

    game.preload('/img/bear.gif');

    game.onload = function() {

        var bear = new Sprite(20, 30);
        bear.x =   0;
        bear.y = 160;
        bear.image = game.assets['/img/bear.gif'];
        bear._element.style.opacity = 1;

        var lblOpacity = new Label();
        lblOpacity.text = '';

        var isMove = false;
        var value = 0;

        bear.addEventListener(enchant.Event.ENTER_FRAME, function(e) {

            var opacity = Number(this._element.style.opacity) * 10;

            if (isMove === true) {

                opacity += value;
                this._element.style.opacity = opacity / 10;
                lblOpacity.text = this._element.style.opacity;

                if (opacity === 0 || opacity === 10) {
                    isMove = false;
                    value  = 0;
                }

            } else {

                if (game.input.up) {

                    if (opacity !== 10) {
                        value =  1;
                    }
                } else if (game.input.down) {

                    if (opacity !==  0) {
                        value = -1;
                    }
                }

                if (value !== 0) {
                    isMove = true;
                }
            }
        });

        game.rootScene.addChild(bear);
        game.rootScene.addChild(lblOpacity);
    };
    game.start();
};