0

マウスオーバー効果は、特定のキャンバスの場所でのみ作成する必要があります。さらに、MousePosition関数を作成しました(以下を参照)。Mouseover効果のコマンドは、MouseOverButton関数にある必要があります。

しかし、それでもうまくいかないようです。

私のコード:

function init() {
    var can=document.getElementById("SnakeCanvas");
    var ctx=can.getContext("2d");
    can.addEventListener('mouseover',MouseOverButton, false);
}

function getPosition(event) {
    var x = new Number();
    var y = new Number();
    var can = document.getElementById("SnakeCanvas");

    if (event.x != undefined && event.y != undefined) {
        x = event.x;
        y = event.y;
    } else {//Firefox Compatability//
        x = event.clientX + document.body.scrollLeft +
        document.documentElement.scrollLeft;
        y = event.clientY + document.body.scrollTop +
        document.documentElement.scrollTop;
    }
    x -= can.offsetLeft;
    y -= can.offsetTop;
    return {mx:x, my:y};
}


function MouseOverButton(e) {
    var can=document.getElementById("SnakeCanvas");
    var ctx=can.getContext("2d");
    var cell=getPosition(event);

    if ((cell.mx > 854 && cell.mx < 985) && (cell.my > 256 && cell.my < 315)) {
        ReplaceImage(ctx,'Images/New_Game_Hover.png',570,100,140,70);
    }
}
4

2 に答える 2

0

のイベントパラメータfunction MouseOverButton(e)が呼び出されますが、これをに渡すときにe使用します。eventgetPosition

var cell=getPosition(event);する必要がありますvar cell=getPosition(e);

于 2013-01-24T11:26:55.553 に答える
0

これを試して:

function MouseOverButton(e) {
    e = e || window.event; // Compatibility
    var can = document.getElementById("SnakeCanvas");
    var ctx = can.getContext("2d");
    var cell = getPosition(e);
//                         ^ That was `event`, breaking your code.
    if ((cell.mx > 854 && cell.mx < 985) && (cell.my > 256 && cell.my < 315)) {
        ReplaceImage(ctx,'Images/New_Game_Hover.png',570,100,140,70);
    }
}
于 2013-01-24T11:32:31.257 に答える