停止滚动显示元素

Question

我想运行进度条动画与滚动。但是如果它不正确的话，它会运行好几次而不是一次。

请帮帮我。

我的代码是：

<div class="demo-5" data-percent="80">
<script>
$(document).ready(function(){
    $(document).scroll(function(){
        $('.demo-5').percentcircle({
            animate : true,
            diameter : 100,
            guage: 3,
            coverBg:'#fff',
            bgColor: '#efefef',
            fillColor: '#8BC163',
            percentSize: '48px',
            percentWeight: '50px'
         });
    });
});
</script>
  progressbar
</div>

​

​

Answer 1

每当用户滚动到元素中的不同位置时，就会触发滚动事件。在实践中，它将被触发一次，一个平滑的滚动动作，然而，如果滚动是‘急转弯’或几个小卷轴，这将触发许多次。

Answer 2

看看这个，我还没测试过，但我希望它能成功，

  $(document).ready(function(){
                        $(document).scroll(function(){
                        $('.demo-5').fadeIn(200);
                            $('.demo-5').percentcircle({
                            animate : true,
                            diameter : 100,
                            guage: 3,
                            coverBg:'#fff',
                            bgColor: '#efefef',
                            fillColor: '#8BC163',
                            percentSize: '48px',
                            percentWeight: '50px'
                             });
                            setTimeout(function()
                            { 
                            $('.demo-5').fadeOut(1000);
                             }, 500);
                        });
                    });