Coding a Street Fighter game | JavaScript, HTML Canvas | Parallax scrolling & Status HUD (Part 8)

Опубликовано: 05 Февраль 2026
на канале: shezzor's Dev Corner
4,004
83

Part 8 of my tutorial series on making a Street Fighter game using web technologies. In this video, we'll replace the current static background with a camera system to enable parallax scrolling. We'll also add the infamous status bar/HUD display at the top of the screen.

Complete Playlist:    • How to code a Street Fighter game  
Patreon Page:   / shezzor  

#canvas #gamedevelopment #javascript

Timestamps:
0:00 Title
0:18 Intro
2:08 Re-cap
2:52 Adding the new source images we'll need for this video
4:33 Adding the Status bar/HUD display at the top of the screen
10:37 Adding the countdown timer logic
14:46 Replacing the static background with actual layers
17:57 Understanding a camera system
18:51 Adding a camera system
24:18 Understanding the stage dimensions
27:35 Attaching the camera to the fighters movement
31:54 Refactoring time!
34:43 Summary and what's next?
35:35 End