Jump to content

Animated counter

Recommended Posts

Site URL: https://tyndallsustainability.com

Hey peeps.

Trying to achieve an animated counter to show the amount of greenhouse emissions offset by my client and it's driving me POTTY.

Have tried a couple of codes from the forum and Youtube but nothing is yet hitting the mark. The closest I've got was a code from @tuanphan but I wasn't able to to work out the delay, or how to get the suffix right so that the units sat next to the animated number.

Ideally, I'd like to be able to show 670,500 kg CO2e as an animated number count, with a delay - so the animation doesn't start until you scroll to it. I'd really appreciate some help 🙂  and I'm a little up against it...!

Ideally, it'll all be centre-aligned, as below but in white:

670,500 kg CO2e

greenhouse gas emissions analysed this year

Link to comment
  • Replies 3
  • Views 469
  • Created
  • Last Reply
Just now, Webswool said:

Site URL: https://tyndallsustainability.com

Hey peeps.

Trying to achieve an animated counter to show the amount of greenhouse emissions offset by my client and it's driving me POTTY.

Have tried a couple of codes from the forum and Youtube but nothing is yet hitting the mark. The closest I've got was a code from @tuanphan but I wasn't able to to work out the delay, or how to get the suffix right so that the units sat next to the animated number.

Ideally, I'd like to be able to show 670,500 kg CO2e as an animated number count, with a delay - so the animation doesn't start until you scroll to it. I'd really appreciate some help 🙂  and I'm a little up against it...!

Ideally, it'll all be centre-aligned, as below but in white:

670,500 kg CO2e

greenhouse gas emissions analysed this year

@IXStudio I know you've dabbled with this kind of thing before - if you have any advice I'd really appreciate the help! 🙂 

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.