JavaScript Fighting Game Tutorial with HTML Canvas
Why Stack Overflow recommends it
Stack Overflow users cite it as the tutorial they are following when they ask about bugs in their own canvas fighting games, such as sprite classes, key events, hitboxes and animations.
Recommended by 1 people across 1 different months, 2022 to 2023.
What it is
A nearly four-hour tutorial from Chris Courses that builds a two-player fighting game from scratch with JavaScript and HTML canvas. It starts with basic movement, attacks and health bars, then adds sprite sheets, animations, hit reactions, death animations and a finished interface.
What people said
Recommends Jad Miri · 2023-05 · Stack Overflow · on “How do I fix the error: "No debugger available, can not send 'variables'" and the error: "height is not defined at ...(methods)"?”
I have been trying to go through with the video by Chris Courses on making a fighting game with html/js ( [this video] ), but I have been getting these errors: Sprite {position: {…}, velocity: {…}, height: 150} index.js:58 No debugger available, can not send 'variables' and this: Uncaught ReferenceError ReferenceError: height is not defined at draw (...\Fighting game\index.js:18:58) at update (...\Fighting game\index.js:22:14) at animate (...\Fighting game\index.js:64:12) at <anonymous> (...\Fighting game\index.js:68:1) --- requestAnimationFrame --- at animate (...\Fighting game\index.js:61:12) at <anonymous> (...\Fighting game\index.js:68:1) this is my launch.json file: { // Use IntelliSense to
Cites GithubUser699 · 2022-09 · Stack Overflow · on “I have "const player" and "const enemy", both using "new Sprite()". However, if I move using "document.onkeydown", only one of them moves. Why?”
I'm doing a tutorial from the YouTube channel Chris Courses ( [this video] ), but at the same time trying to implement a few things I already know. In this case I'm trying to achieve the same that he does, but using a few different approaches. I have a problem though. I created a class "Sprite" and a "const enemy" as well as "const player", both using the Sprite class. The Sprite class uses another class, which is the "Controls" class. If I only declare "const player" (or "const enemy"), but not the second one, I can move the character just fine. If both are declared, however, only one of them moves. I don't understand why, though. In my understanding const player = new Sprite(); and const enemy
Cites james_shortt · 2023-06 · Stack Overflow · on “Animation and Hit Registration issues with 2d fighting platformer”
I have been working on a 2D fighting game, and it has been mostly going well, except for a few issues. I am working on 3 separate JavaScript pages, and one HTML page. My issues are present in the death sequence and animation for my two player sprites, as well as in the accuracy of my players hit boxes and attack boxes. I have tried many solutions and can't seem to find one. I have mostly been following this tutorial if anyone needs it for reference. [this video] Death Animation: Tried to animate the death for each sprite, the same way I did for my other animations (which all work fine), but nothing happens on player death. Hitboxes and Attack Boxes: I have tried to make two separate functions for