0

ビットマップをステージに追加すると、イベントリスナー (デモからコピー) が機能しない理由がわかりません。別の円などを追加するとクリックが正常に機能するため、ビットマップが問題を引き起こしているようです。

例を参照してください:

    <!DOCTYPE html>
<html>
<head>
    <title>EaselJS demo: Simple animation</title>
    <link href="../_shared/demo.css" rel="stylesheet" type="text/css">
    <script src="http://code.createjs.com/easeljs-0.7.0.min.js"></script>
    <script>    
        var stage, circle;
        var counter = 0;
        var ticounter = 0
        var images = []
        var mytext = 'kk';
        var lepakko;
        var mx = 0;
        function init() {
            stage = new createjs.Stage("demoCanvas");

            var circle = new createjs.Shape();
            circle.graphics.beginFill("red").drawCircle(0, 0, 50);
            circle.x = 500;
            circle.y = 500; 

            stage.addChild(circle);
            stage.update();
            lepakko = new createjs.Bitmap("halloween-bat.png");

            //Click works, if line below is commented out, why?
            //stage.addChild(lepakko);



            circle.addEventListener("click",circle_event);
            stage.update();
        }

        function circle_event(event) {
            alert("clicked");
            };
    </script>
</head>
<body onLoad="init();">
    <canvas id="demoCanvas" width="700" height="700">
        alternate content
    </canvas>
</body>
</html>
4

1 に答える 1

1

クリックはデフォルトでは機能しません。EaselJS ライブラリでは、マウスオーバー イベントを明示的に有効にする必要があります。以下を追加する必要があります。

stage.enableMouseOver(20);

ステージ作成後。カーソルがオブジェクト上にあるときにカーソルをポインターに変更するには、EaselJS にカーソルというプロパティがあります。

// doesn't work, even if a function is decleared outside
// circle.addEventListener("mouseover", function() { document.body.style.cursor = "pointer"; });
// this works
circle.cursor = "pointer";

メソッド enableMouseOver は、EaselJS Web サイトに記載されています。EaselJS でマウスオーバーやその他のイベントをリッスンすることは、Web ブラウザーにとってより要求が厳しいことに注意してください。

于 2014-04-14T20:47:50.797 に答える