Question

我应该修改以下代码，以便能够使用键盘从左到右移动篮子img（键左 - 右键）......

这是一款小型游戏，其元素落在了屏幕上，而你应该抓住一个篮子。

但每次我想尝试修改一些我无法获得正确结果的东西。

这里是代码：

 function init() {
    if (window.top != window) {
        //document.getElementById("header").style.display = "none";
    }
    document.getElementById("loader").className = "loader";
    // create stage and point it to the canvas:
    canvas = document.getElementById("sandbox");
    context = canvas.getContext('2d');

    //check to see if we are running in a browser with touch support
    stage = new createjs.Stage(canvas);

    // enable touch interactions if supported on the current device:
    createjs.Touch.enable(stage);

    // enabled mouse over / out events
    stage.enableMouseOver(10);
    stage.mouseMoveOutside = true; // keep tracking the mouse even when it leaves the canvas

    //load image
    var image = document.getElementById("basketIMG");
    var container = new createjs.Container();
    stage.addChild(container);


    bitmap = new createjs.Bitmap(image);
    container.addChild(bitmap);
    bitmap.x = 540;//position
    bitmap.y = 690;
    bitmap.scaleX = bitmap.scaleY = bitmap.scale = 0.2;//taille


    // using "on" binds the listener to the scope of the currentTarget by default
    // in this case that means it executes in the scope of the button.
    bitmap.on("mousedown", function(evt) {
        this.parent.addChild(this);
        this.offset = {x:this.x-evt.stageX, y:this.y-evt.stageY};
    });

    // the pressmove event is dispatched when the mouse moves after a mousedown on the target until the mouse is released.
    bitmap.on("pressmove", function(evt) {
        this.x = evt.stageX+ this.offset.x;

        // indicate that the stage should be updated on the next tick:
        update = true;
    });

    bitmap.on("mouseup", function(evt){
    stop();
    });



//}

document.getElementById("loader").className = "";
createjs.Ticker.addEventListener("tick", tick);
}
function stop() {
    createjs.Ticker.removeEventListener("tick", tick);
}



function tick(event) {
    // this set makes it so the stage only re-renders when an event handler indicates a change has happened.
    if (update) {
        update = false; // only update once
        stage.update(event);
    }
}

你能帮我解决这个问题......

您可以在此处看到最终游戏的演示：http://sandbox.informatiquegestion.ch/TomateGademavo/index.html?difficulty=1&idgroup=1#startButton

提前谢谢

Easel JS：用键盘移动位图

0 个答案: