Formula(HTML) progress bar

First test:

On my first test, I’ve replicated your concern with simpler values:

<progress style=”accent-color:red;” value=”‘||55-5||'” max=”100″></progress>’

image.png

Results:

image.png

Which is to be expected based on your concern.

Second Test:

I followed your advise wherein if I change the arithmethic symbol to * or /:

‘<progress style=”accent-color:red;” value=”‘||10*5||'” max=”100″></progress>’

Results:

image.png

With this, it shows the correct progress bar as you’ve mentioned.

Final Test:

With this knowledge, I’ve added parenthesis ( ) to the arithmetic expression while using the minus symbol:

‘<progress style=”accent-color:red;” value=”‘||(60-5)||'” max=”100″></progress>’

Results:

image.png

With this final formula, I was able to display the correct progress bar whilst using the minus symbol.

Leave a comment

Your email address will not be published. Required fields are marked *