游戏结束了蛇游戏

Question

我正在做一个蛇游戏，当飞船坠毁时，我希望在上显示游戏。我想要Game Over图像出现并做一些漂浮在棋盘游戏中心的东西。

我认为我必须放在这里，但不知道该怎么做。

var makeAStep = function() {
if (snake.detectCollision(snake.velocity) === true) {
    var explosion = $('<div id="explosion"><img src="images/explosion.gif"></div>');
    var newcss = {
        top: parseInt($("#head").css("top").substring(0, $("#head").css("top").length - 2)) - 90 + 'px',
        left: parseInt($("#head").css("left").substring(0, $("#head").css("left").length - 2)) - 61 + 'px',
        position: 'absolute'
    };
    explosion.css(newcss);
    $('#box').append(explosion);
    var alertInterval = setInterval(function() {
        clearInterval(alertInterval);
        $('#explosion').remove();
    }, 800);

    clearInterval(intervalHandler);
    intervalHandler == null;
    return;
}

var lastItemPosition = snake.body[snake.body.length - 1].position.copy();

snake.move();

var iJustAteSomeFood = snake.getHead().isOnPosition(food.position);

if (iJustAteSomeFood == true) {
    food.updateScore();
    generateFood();
    snake.body.push(new snakeItem(lastItemPosition));
}

snake.screenUpdate({updateFireballs: iJustAteSomeFood});

};

The complete code

Answer 1

由于您使用的是jQuery，因此可以调用modal dialog

if (snake.detectCollision(snake.velocity) === true) {
  $("#dialog").dialog("open"); // here
  ...
}

创建<div id="dialog">...</div>后，请参阅链接示例。

注意：好游戏。你应该禁用180°旋转，即向左移动的宇宙飞船不应对右箭头作出反应。