enchant.jsでHTML要素を追加する

Javascriptでゲームをつくるためのライブラリ enchant.js を使っていた。enchant.jsではSpriteやLabelといった表示内容はHTMLのdiv要素で構成される。

このdiv要素に対してHTMLのタグを追加してゲームっぽくない要素を追加したい時どうすればいいんだろうと、enchant.jsのソースを読んでいたら、そもそもenchant.Labelのtext属性はLabelを構成するdivのinnerHTMLを設定するものだった。そのため、以下のように書けば簡単に画面内にHTMLで構成した要素を登場させられる。

var scene = new Scene();
var myhtml = new Label(300,120);
myhtml.text = '<div style="width:100%; height:120px;">これはテストです。</div>';
scene.addChild(myhtml);
game.pushScene(scene);

Pocket

Tweet