Skill bar only moving when visible on page

[chechu]

Hey all,

I got this wonderfull skill bar that works perfectly and looks like this:

Problem is that the bars are moving as soon as the page loads, so if the bars are placed at the bottom of the website, when you reach the bottom, the bars are already there and not moving. How can I get the bars to move only when you see them, please?

Here's the code:

jQuery(document).ready(function(){
	jQuery('.skillbar').each(function(){
		jQuery(this).find('.skillbar-bar').animate({
			width:jQuery(this).attr('data-percent')
		},6000);
	});
});

Thanks!

[Beverleyh]

Looks like this is your answer http://stackoverflow.com/a/24614918