Animation triggers

Hi there. I bought this theme yesterday and getting on pretty well with it (great product) but I am just wondering whether there is a way of changing the animation triggers? By default they seem to be triggered as soon as they come into view on scroll. I actually want them to trigger when the element gets to the top of the window. I have used Skrollr in the past to achieve this.

If not, I have written some jquery to do it (though not sure this is the best way), but now wondering where to put it. Should it go the functions.js?

Here is the code I have currently:

    allSections = $('.scroll-section');
    allSections.css('opacity','0');
    $window = $(window);
    fadeSection();		

	function fadeSection(){
		$(".scroll-section").each(function(){
			var distance = $(this).position().top;
	    	if ( $window.scrollTop() >= distance - 100 ) {
	        	// Your div has reached the top
	        	//allSectionIDs.push(this.id, offset.top);
	    	 	$(this).stop().animate({
				    opacity: 1
				  }, 500, function() {
				    // Animation complete.
				});
	        	console.log($(this).attr("id") + " has reached the top");
		    }
		    else{
	    	 	$(this).stop().animate({
				    opacity: 0
				  }, 500, function() {
				    // Animation complete.
				});			    	
		    }
		});			
	}

	$window.scroll(function() {
		fadeSection();
        });