元素在屏幕上可见时运行动画

我有一点进度条脚本。 它运行正常，但在页面加载时运行。 我希望在屏幕上显示条形时运行动画（如果进度条在选项卡中，它也应该工作）。 我怎么能得到这个？

这是脚本：

setTimeout(function(){ $('.skill-bar .skill-bar-content').each(function() { var me = $(this); var perc = me.attr("data-percentage"); var current_perc = 0; var progress = setInterval(function() { if (current_perc>=perc) { clearInterval(progress); } else { current_perc +=1; me.css('width', (current_perc)+'%'); } me.text((current_perc)+'%'); }, 10); }); },10); 

jsFiddle： http ： //jsfiddle.net/fUyYL/

Answer 1

像这样的东西？ http://jsfiddle.net/fUyYL/1/

 var ele = $('#skill-bars'); if( ele.is(':visible') ) { ... }