Mam wykres słupkowy, który animuje za pomocą CSS3, a animacja jest aktywowana w chwili ładowania strony.

Mam problem z tym, że dany wykres słupkowy jest umieszczany poza ekranem z powodu dużej ilości treści, więc zanim użytkownik przejdzie do niego, animacja już się zakończyła.

Szukałem sposobów albo poprzez CSS3 albo jQuery, aby aktywować animację CSS3 na wykresie słupkowym, gdy widz zobaczy wykres.

<div>lots of content here, it fills the height of the screen and then some</div>
<div>animating bar chat here</div>

Jeśli przewijasz naprawdę szybko w dół po wczytaniu strony, możesz zobaczyć, że jest animowany.

Tutaj jestjsfiddle mojego kodu. Poza tym nie wiem, czy to ma znaczenie, ale mam kilka wystąpień tego wykresu słupkowego na stronie.

Natknąłem się na wtyczkę jQuery zwaną waypointem, ale nie miałem absolutnie żadnego szczęścia, aby ją uruchomić.

Gdyby ktoś mógł skierować mnie we właściwym kierunku, byłoby to bardzo pomocne.

Dzięki!