Я просто играю с HTML, но когда я загружаю свой код, я получаю сообщение об ошибке. Код ошибки: недостаточно памяти - PullRequest
0 голосов
/ 09 мая 2020

код короткий, и это не может быть из-за устаревших систем, так как этот ноутбук был куплен 4 месяца go. Каждый раз, когда я нажимаю на файл index. html, загрузка занимает 50 секунд, а затем я получаю сообщение об ошибке. Я не уверен, что еще делать, поскольку команда поддержки Microsoft была бесполезна. Я не уверен, есть ли в коде ошибки, так как я не могу его запустить. Любая помощь приветствуется.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <title>A canvas</title>
  </head>
  <style type="text/css">
      canvas {
        border: 1px solid black;
      }
  </style>
  <body>
    <canvas id="canvas" height="1000px" width="1000px"></canvas>
    <script>

        var canvas = document.getElementById('canvas');
        var c = canvas.getContext('2d');
        canvas.addEventListener('mousedown', onDown, false);

        var fireWall = false;
        var score = 0;

        while (score != 10){
          c.font = "30px Comic Sans MS"
          c.fillText(score, 500, 200)
          c.font = "30px Comic Sans MS"
          c.fillText("Click the Screen 10 Times to Win the Hardest Game Ever!!!", 50,300);

          function onDown(){
            console.log('working')
            c.score++;
            }

          if(score === 10){
              fireWall = true;
              break;
          }
        }

        if(fireWall === true){
            c.fill(255, 153, 0);
            c.noStroke();
            c.ellipse(mouseX-90, mouseY-30, 75, 25);
            c.ellipse(mouseX-90, mouseY-80, 85, 35);
            c.rect(mouseX-103, mouseY-80, 25,45);
            c.rect(mouseX-132, mouseY-155, 85,75);
            c.textSize(50);
            c.fill(255,0,0);
            c.text("YOU WON", mouseX-205, mouseY-170);
        }

    </script>
  </body>
</html>

com / jywPv.png

1 Ответ

1 голос
/ 09 мая 2020

const c = document.getElementById('canvas').getContext('2d');

const game = { // You could use an Object literal to store stuff
  fireWall: false,
  score: 0,
  mouseX: 0,
  mouseY: 0,
};

const draw = () => { // Create a function to handle drawing

  // Don't forget to clear the canvas before painting
  c.clearRect(0, 0, c.canvas.width, c.canvas.height);
  c.font = "30px Comic Sans MS";
  
  if (game.fireWall) {
    c.fillText("YOU WON", game.mouseX-80, game.mouseY-5);
  } else {
    c.fillText(game.score, 500, 200); // Retrieve the score from game Object
    c.fillText("Click the Screen 10 Times to Win the Hardest Game Ever!!!", 50, 300);
  }
}

const onDown = (ev) => { // Don't forget the ev Event!

  if (game.fireWall) return; // Prevent additional clicks if firewall reached

  const bcr = c.canvas.getBoundingClientRect();
  game.mouseX = ev.clientX - bcr.x;
  game.mouseY = ev.clientY - bcr.y;
  game.score++;

  if (game.score >= 10) {
    game.fireWall = true;
  }
  draw();
}

draw(); // First draw!
c.canvas.addEventListener('mousedown', onDown); // And draw on click
canvas {
  border: 1px solid black;
}
<canvas id="canvas" height="1000px" width="1000px"></canvas>
...