Pixijs Interactive Sprite

pixijs-interactive-sprite.png

クリックするたび猫が拡大します

<script src="http://miffysora.wikidot.com/local--files/webgl/pixi.min.js" type="text/javascript"></script>
</script>
<script type='text/javascript' >
var renderer = PIXI.autoDetectRenderer(200, 200,{backgroundColor : 0x533E25});
document.body.appendChild(renderer.view);
 
// create the root of the scene graph
var stage = new PIXI.Container();
var sprite = PIXI.Sprite.fromImage('http://miffysora.wdfiles.com/local--files/pixijs/favisora.png');
sprite.position.set(100,80);
sprite.interactive = true;
//onはJQueryの関数です
sprite.on('mousedown', onDown);//PCの場合
sprite.on('touchstart', onDown);//スマホなどのタッチデバイスの場合
 
stage.addChild(sprite);
 
function onDown (eventData) {
 
    sprite.scale.x += 0.3;
    sprite.scale.y += 0.3;
}
//アニメーションスタート
animate();
function animate() {
    requestAnimationFrame(animate);
    // render the root container
    renderer.render(stage);
}
</script>
<body>
</body>

サポートサイト Wikidot.com