Question

我有一个drawButtons函数，其参数为“nonhover”，“hover1”或“hover2”，并为画布绘制一个新按钮，根据所需的参数，将绘制不同颜色的按钮。当我从setUpGame()调用它时它确实有效，但是当我从draw()调用它时它不起作用。我想从draw（）调用它，因为draw()在setInterval()中被调用80次。这样它可以继续检查鼠标是否悬停在按钮上并绘制相应的按钮组。

在任何对象或函数之外调用

setUpGame()。 draw()调用setInterval()，它位于任何函数或对象之外。 setInterval调用每秒绘制80次。

getMouseOver()另一个应该由draw()实际调用的函数，因为它说“如果鼠标超过按钮1：drawButtons（”hover1“）等等。它只是没有我打电话时不要画按钮。

浏览器Javascript控制台中没有错误。我使用的Chrome最适合我的游戏。

从这里我们可以推断drawButtons()没有问题，因为它从setUpGame()调用时有效。

draw()可能存在问题，因为当我从那里调用它时drawButtons()不起作用（但是为了让我们更加困惑，当我从那里调用它时，displayNumbers会显示数字）它在玩游戏时工作正常（这里我们不玩游戏，我们在开始屏幕上）。

getMouseOver()可能存在问题，因为这在任何地方都无效。

我现在要告诉你getMouseOver()。我的程序变得越来越大，从一开始就显示出太多的压力。我打算每秒调用80次这个函数。

getMouseOver: function() {
    window.onload = (function(){
        window.onmouseover = function(e) {
            // IE doesn't always have e here
            e = e || window.event;

            // get event location

            // change the code so that it gives the relative location
            var location = {
            x: e.pageX - offset.x,
            y: e.pageY - offset.y
            };
            if (location.x > 103.5 && location.x < 265.5) {
                if (location.y > 240 && location.y < 291) {
                    nonGameContent.drawButtons("hover1");
                }
            }
            if (location.x > 103.5 && location.x < 265.5) {
                if (location.y > 160 && location.y < 212) {
                    nonGameContent.drawButtons("hover2");
                }
            }
            else{
                nonGameContent.drawButtons("nonHover");
            }
        }
    })},

Answer 1

在这个小提琴中你有click（）和onmousemove（）正在工作。如果你想在开头显示按钮，或者只是当鼠标悬停在按钮的未来位置的某个地方但是它是一个开始时，我不太清楚： http://jsfiddle.net/Akinaru/3a7g2/57/

主要修改：

 canvas.onmousedown = nonGameContent.getMouseClick;
 canvas.onmousemove = nonGameContent.getMouseOver;

Answer 2

在鼠标悬停时更改画布矩形颜色使用onmousemove查找是否在它上面，然后使用不同颜色的矩形重绘画布

getMouseClick：function（）{ window.onmousemove = function（e）{

帆布按钮onmouseover改变颜色

2 个答案: