各スクロールでのスクロール機能の再生アニメーションについて

Question

ユーザーがそのセクションまでスクロールしたときに、ローディングまで円の進行状況バーを作成しようとしています。

ユーザーが特定のポイントに達すると、機能が起動し、進行状況バーがアニメーション表示されますが、上下にスクロールすると機能が再開します。どのように修正できますか？

$(window).scroll(function() { 
var wScroll = $(this).scrollTop();  
if (wScroll > $('#skills').offset().top - ($(window).height()/1.9)) { 
    //PROGRESS BAR CODE GOES HERE 
} 

DEMO

Answer 1

ただ、アニメーションが開始されているかどうかを確認し、それがある場合に再起動しません。

if (window.playing) return; 
window.playing = true; 

UPDATED PEN