JavaScript
Article

jQuery Detect % Scrolled on Page

By Sam Deering

jQuery code snippet to create an event action when a user has scrolled down to a percentage of the web page. We have tested that it’s best to use values between 55 and 100% when catching mouse scrolls.

$(document).ready(function(){

//Example - show a div after 75% of the web page is scrolled.
var webpage = $("body");
var webpage_height = webpage.height();
//alert(webpage_height);
var trigger_height = webpage_height * 0.75;


if ($(window).scrollTop() > (webpage_height-trigger_height)) {
	//alert($(window).scrollTop()+" > "+(webpage_height-trigger_height));
	$("#divtoshow").show();
}

});

Free Guide:

7 Habits of Successful CTOs

"What makes a great CTO?" Engineering skills? Business savvy? An innate tendency to channel a mythical creature (ahem, unicorn)? All of the above? Discover the top traits of the most successful CTOs in this free guide.

No Reader comments

Recommended
Sponsors
Because We Like You
Free Ebooks!

Grab SitePoint's top 10 web dev and design ebooks, completely free!

Get the latest in JavaScript, once a week, for free.