Log in
Search
Display results as :
Advanced Search
Latest topics
MarionetteDecember 2nd 2018, 2:31 pm+/-
suck on my magnum dongOctober 18th 2018, 9:25 pmGemini
It's my birthday.October 4th 2018, 8:20 pmGemini
EWSeptember 9th 2018, 3:53 amGemini
Statistics
We have 3557 registered usersThe newest registered user is Shirou Seeker of DucknessOur users have posted a total of 143995 messagesin 12544 subjects

Share
Go down
avatar
Paul:)
Post Count : 1496

Health Bar Code and Tutorial

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. :)

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



Health:






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.

Health:







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.

Health:






Health:






No credit needed guys, take it as you want it. Just remember who it was that taught you if anyone ever asks. Enjoy!
Back to top
Permissions in this forum:
You cannot reply to topics in this forum