How easily create an animated number counter?

[Billy]

I simply need to have a percentage number increment over 1 second, so would say “0%” counting up to “95%” over the space of a second or two.

Any ideas how? Creating a textbox for each number and then hide/reveal the next would be very time consuming!

[MarkHunte]

Here is a template.

It is a quick cobble together and hopefully my math logic prevails . (Not always good at it )

Hopefully others will chip in if they see a simpler way..

Simple Percent Count down numbers and Bar

This is a simple Percent count down with two counters. A number count and a bar. In this template the main code is in the header. And is called using a hype function with a button. It is written this way to control when the count down starts. [image] PercentTimer.hypetemplate.zip (24.2 KB)

It is derived from:

Javascript countdown clocks using HTML iframe

Thought the group might like this. Simple countdown clock Hype Recipe using the inner HTML widget within Hype. Enjoy, restyle tear apart and re-use! Nick countdown timer.hype.zip (143.7 KB) [image]

[Billy]

That’s cool. Do you have one that goes from 0 to 100% with the bar increasing in width instead?

I have 4 bars that needs to expand at different widths ending at 95, 99, 97 and 97%.

[MarkHunte]

Made one that you can set to either up ir down. Just waiting to get my Mac back online…

[MarkHunte]

@Billy

That's cool. Do you have one that goes from 0 to 100% with the bar increasing in width instead?

I have 4 bars that needs to expand at different widths ending at 95, 99, 97 and 97%.

I have updated the Template post with the new Document example