Home

jQuery scroll up is u plugin to load content when scrolling to the top of an element or a window.
Just like Facebook messages are loaded when you scroll up.

You can find an example right here: http://scrollup.comule.com/

download the jquery.scrollUp.1.0.0.js file to use it.

---

Options

• contentType: The type of the request (‘GET’ or ‘POST’)
• contentPage: The url of the ajax service where you get your data
• contentData: Additional data for the request
• beforeLoad: Event is triggered before the loading starts
• afterLoad: Event is triggered when the loading completes
• scrollTarget: The element that is scrolling
• heightOffset: When passing this height (in pixels) the loading starts

---

Include the libraries

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="jquery.scrollUp.1.0.0.js"></script>

---

Tip: scroll the window down before wiring up the plugin

$('#scrollupdemo').scrollTop($('#scrollupdemo').prop('scrollHeight'));

---

Wiring up the plugin to an element

$('#content').scrollUp({
	'contentPage': 'democontent.html', // the page where you are searching for results
	'contentType' : 'GET', // the ajax method for the request
	'contentData': {}, // you can pass the children().size() to know where is the pagination
	'scrollTarget': $('#scrollupdemo'), // who gonna scroll? in this example, the full window
	'heightOffset': 100, // how many pixels before reaching end of the page would loading start? positives numbers only please
        'animateScroll': true, // turn on or off scroll animation after loading new messages
	'beforeLoad': function(){ // before load, some function, maybe display a preloader div
		$('#loading').fadeIn();	
	},
	'afterLoad': function(elementsLoaded){ // after loading, some function to animate results and hide a preloader div
		 $('#loading').fadeOut();
		 var i = 0;
		 $(elementsLoaded).fadeInWithDelay();
		 if ($('#content').children().size() > 100){ // if more than 100 results loaded stop (only for test)
			$('#noresults').fadeIn();
			$('#content').stopScrollUp();
		 }
	}
});