CODEWITHSUNDEEP
javascripthtml
user3047715
user3047715

Reputation: 73

How to make a health bar

I am trying to make my own version of a pokemon game using very simple HTML and JavaScript.

So far, I have everything covered, except the health bar. How do I make an entity in my code, that will represent a bar, and when the opposing team selects a move, the health bar goes down?

Would I use a bunch of small div's?

Upvotes: 6

Views: 27837

Answers (3)

Ren Lowsphere
Ren Lowsphere

Reputation: 7

Im working on a game too using nodejs pure js and a lot of libraries i recommend you use a percentage as the bar will cover the content

Upvotes: -1

Marc
Marc

Reputation: 426

You could try Bootstrap's progress bar component.

Upvotes: 3

MultiplyByZer0
MultiplyByZer0

Reputation: 7129

I would recommend a HTML progress bar:

<progress id="health" value="100" max="100"></progress>

And when they lose/gain health, do run this Javascript code:

let health = document.getElementById("health")
health.value -= 10; //Or whatever you want to do with it.

Upvotes: 16

Related Questions