How to use object collision in a game?

Question

Hey, im trying to make a little game.. But ill need to make object detection for the walls, but i cant get it too work.. https://code.sololearn.com/W9LodTtqQmyn/#js This is a code that works in https://codepen.io/zer0/pen/JxxYgQ but not in sololearn, can anyone help me with how thats possible?

Answer 1

It is an event like onclick. You have to put the canvas declaration inside it, and the functions that use it. I didn't look at your code that much, but it's something like this:

let canvas, ctx;

window.onload = () => {
canvas = document.querySelector("canvas");
ctx = canvas.getContext("2d");

loop();
};

Answer 2

It works, but the problem is, that you want to select the canvas before the document loads. You can either use the window.onload function, or putting your JS at the bottom of the body:
https://code.sololearn.com/WdO46w4SiZ73/?ref=app

Answer 3

Thanks alot!! it works :D

Answer 4

Thanks alot! could you also explain how to use the onload? Since it will get a bit messy if its all in the html file..