Thank you for this - I just used it for my own web app!
May I make a recommendation? Some browsers (Safari or Browsers on iOS) will let you scroll "above" 0, into the negative numbers. This will cause the header to collapse after the user scrolls to the top. I would recommend changing the following line in your changeHeaderClass:
lastY = y;
to:
lastY = y >= 0 ? y : 0;
This will prevent the lastY value from becoming negative.
Or, instead - you can short-circuit the entire function by adding the following to the first line of it:
if (y < 0) return 'pin';
Which would technically be more efficient I guess 🙃
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thank you for this - I just used it for my own web app!
May I make a recommendation? Some browsers (Safari or Browsers on iOS) will let you scroll "above" 0, into the negative numbers. This will cause the header to collapse after the user scrolls to the top. I would recommend changing the following line in your
changeHeaderClass:lastY = y;to:
lastY = y >= 0 ? y : 0;This will prevent the
lastYvalue from becoming negative.Or, instead - you can short-circuit the entire function by adding the following to the first line of it:
if (y < 0) return 'pin';Which would technically be more efficient I guess 🙃