Jquery animation to be start when scroll to that portion of page

Question

I want one page scroll type animation on my webpage so i follow this tutorial and successfully implemented this.

now suppose I have five scroll portion in my webpage that is I can scroll maximum five time or there are five different section in the page.

I want to implement this box animation at one of the section in the page. according to this animation six boxes are at random position and then they embed to a div. I again successfully implement this.

But there is a problem.

I want the box animation to be started when i scroll to that section of my page, that means if the box animation is at 5th section of the page and when i move to 5th section that animation starts.

How can I implement this?

code to respective animation is already linked above

jquery code for box-animation

$(document).ready(function(){
var h = $(window).height();
var w = $(window).width();            
$('#intro .box').each(function(){
    var originalOffset = $(this).position(),
        $this = $(this),
       tLeft = w-Math.floor(Math.random()*900),
       tTop  = h-Math.floor(Math.random()*900);

    $(this).css({
        "left": tLeft,
        "top": tTop
    });

    $this.animate({ "left": originalOffset.left, 
                     "top": originalOffset.top
                 },5000);

    });
});