Bolboa Bolboa - 1 year ago 41
jQuery Question

check if user scrolled to a certain percentage of screen

At the moment, I have the following...

if ($(window).scrollTop() + $(window).height() > 1150)

So if the user scrolls past 1150px this condition is called. Is there a way to change my if condition so that if the user scrolls to 20% of the screen, rather than a given pixel number, than the if condition will be called.

The reason I ask is because this if condition does not take into consideration the heights of different screens. When I test this on different screen sizes I get different results

Answer Source

You're actually already using everything you need to do that. I would suggest using the native window property innerHeight instead of $(window).heightthough.

What you want to do is specify a maximum height depending on your current innerHeight before you do the check:

var maxHeight = window.innerHeight * 0.2;
if( $(window).scrollTop() > maxHeight ) {
   // do what you want to do