search

tigrr / circle-progress

Responsive, accessible, animated, stylable with CSS circular progress bar available as plain (vanilla) JS and jQuery plugin.
https://tigrr.github.io/circle-progress
MIT License
171 stars 44 forks source link

Start animation in the browser's viewport #36

Open Ivan-Eremeev opened 2 weeks ago

Ivan-Eremeev commented 2 weeks ago

Hello. I use circle progress in the middle of the page. Is it possible to start the circle animation when the user scrolled the page to the circle?

tigrr commented 2 weeks ago

Hi. You can use the Intersection Observer API for that. Here is a demo that animates circle progress to the final value when it's completely visible and resets it to 0 only once it's been fully hidden from screen.

Ivan-Eremeev commented 2 weeks ago

Thank you. This is exactly what I need.