Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Lazy Image Loading #12

Open
davefmoore opened this issue Nov 1, 2016 · 1 comment
Open

Lazy Image Loading #12

davefmoore opened this issue Nov 1, 2016 · 1 comment

Comments

@davefmoore
Copy link

Have you ran into any situations where the page has lazy image loading and the scroll doesn't calculate the correct positioning (obviously)... Do you know any solutions for this? window.onscroll true = recalculate?

@malihu
Copy link
Owner

malihu commented Nov 1, 2016

The issue you describe is not specific to "Page scroll to id" (the same problem will happen if you disable "Page scroll to id" and let the page jump to an anchor point).

If your image placeholders don't have a height set, then when each image is loaded, the page length increases. Each time the page length increases, all elements that are positioned before the last loaded image, will have a different top position.

So when you click a "Page scroll to id" enabled link, the script calculates the position to scroll to but this position has changed (while the page scrolls) simply because an image has loaded.

The standard solution is to have a height set for you image placeholders.

Another solution would be to use plugin's scrollTo method in your lazy-loading script but this would require extra coding in order to avoid other issues.

In general, when you have lazy-loading without a height set for each image placeholder and anchor links on the same page, you'll have this issue regardless of using "Page scroll to id" or not.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants