Log in

I forgot my password


Display results as :

Rechercher Advanced Search

Latest topics
» Marionette
Health Bar Code and Tutorial EmptyDecember 2nd 2018, 2:31 pm by +/-

» suck on my magnum dong
Health Bar Code and Tutorial EmptyOctober 18th 2018, 9:25 pm by Gemini

» It's my birthday.
Health Bar Code and Tutorial EmptyOctober 4th 2018, 8:20 pm by Gemini

» EW
Health Bar Code and Tutorial EmptySeptember 9th 2018, 3:53 am by Gemini

» What are Your Current Plans for Your Character?
Health Bar Code and Tutorial EmptyFebruary 11th 2018, 7:33 pm by Chastelle

We have 3557 registered users
The newest registered user is Shirou Seeker of Duckness

Our users have posted a total of 143994 messages in 12544 subjects

Health Bar Code and Tutorial

Go down

Health Bar Code and Tutorial Empty Health Bar Code and Tutorial

Post by Paul:) on April 18th 2016, 5:55 pm

This is actually pretty basic HTML that anyone can learn, I learned it after watching a YouTube tutorial on how to make something completely different. Needless to say the guy indirectly taught me how to do something that I thought was freakin' awesome! It's so easy in fact, that I decided I'd share it with you guys, since I plan on using it now. :)

<progress id="healthbar" value="100" max="100" style="width:300px;"></progress>


In the code above my value is at 100-- meaning my healthbar is maxed. I haven't taken damage yet in the RP, woot! Now, after getting slapped around by my enemy to the point I'm half beaten I can easily make this bar change. I just have to make my value 50 and poof, the code will change the bar to this. It's fucking cyber magic dudes.


If you want to change the length of your bar as a whole, just change the width, it's easy as pie. By changing my width from 300px, to 100px I end up with the bar below.



No credit needed guys, take it as you want it. Just remember who it was that taught you if anyone ever asks. Enjoy!

Post Count : 1496

Back to top Go down

Back to top

- Similar topics

Permissions in this forum:
You cannot reply to topics in this forum