Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

[HELP] Dynamic progress bars?

1548172269
Missingquery
Pro
Sheet Author
API Scripter
I'm currently making a character sheet for a system that requires (or at least heavily suggests) having some sort of progress bar indicator. Given the lack of ids in Roll20 sheets, manipulating HTML elements with JS is out of the question, as far as I'm aware. Is it somehow possible to implement a progress bar, the progress of which would be based on a neighboring <input> element, in Roll20?  All of the Pure CSS solutions I've found online seem to style the bar off of a set of fixed values (quarter-full, half-full, etc.), which is the opposite of what I'd want.
1548172549
vÍnce
Pro
Sheet Author
Not sure if this is what you are needing, but have you had a look at the Custom Progress Bar demo in the wiki's CSS Wizardry page? <a href="https://wiki.roll20.net/CSS_Wizardry#Custom_Progress_Bar" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Custom_Progress_Bar</a> &nbsp;
1548173168
Missingquery
Pro
Sheet Author
API Scripter
Close, but that still has the problem of having preprogrammed progress values- half, full, etc. I'm looking for something more like the current/max attribute bars on tokens, where the value of the bar depends on the current attribute value, except obviously implemented in the character sheet itself.
1548177441
Jakob
Sheet Author
API Scripter
You could probably fake something like a progress bar using a gradient. You'd still be limited to a finite set of possible values, but a resolution of, say, 100 units should be good enough. You could theoretically achieve arbitrary resolution using a repeating section, but I would advise against it.