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

React Fullpage.js flickers when scrolling on the first load of the site #270

Open
shielakn opened this issue Sep 10, 2021 · 5 comments
Open

Comments

@shielakn
Copy link

shielakn commented Sep 10, 2021

Hi! I hope someone can help me out with this problem...

Here's a screen capture of my site whenever I scroll on the first load of the page: https://www.screencast.com/t/aEhZvtZS

It seems like before it goes to the next section, it goes to the top then quickly goes back to the actual section.

I built the site using Gatsby and I'm not sure what's going on. It doesn't happen when I'm on my localhost but once I pushed it to a staging site, I see the issue.

// fullpage options
const decadeSectionOptions = { anchors: decadeAnchors, paddingTop: '110px', scrollBar: false, scrollingSpeed: 800, lazyLoading: true, autoScrolling: true, continuousVertical: true, recordHistory: true, };

// gatsby-browser.js
export const shouldUpdateScroll = ({ routerProps: { location }, getSavedScrollPosition }) => { if (location.search) { window.setTimeout(() => window.scrollTo(0, 0), 100); } if (location.hash) { return false; } return true; };

This is the only error I get on my console:
image

Please help.

Thanks!

@alvarotrigo
Copy link
Owner

Can you provide an isolated reproduction in Codesandbox with no CSS or JS files external to fullPage.js and the minimum amount of HTML code? Use empty sections with a single heading unless strictly necessary for the reproduction.

This is the only error I get on my console:

Did you try clicking on the link provided by the error? :)
Basically, it tells that you need a license if you plan to use it in non open-sourced projects compatible with GPLv3 license:
https://alvarotrigo.com/fullPage/pricing/

@shielakn
Copy link
Author

Thanks, @alvarotrigo for the quick reply!

I'll try purchasing the license and see if it solves the problem.

I'll keep you posted! Thanks again.

@alvarotrigo
Copy link
Owner

alvarotrigo commented Sep 10, 2021 via email

@shielakn
Copy link
Author

Oh I see. Here's a link to isolated reproduction: https://codesandbox.io/s/react-fullpage-js-example-forked-5di44?file=/src/index.js

I can't seem to reproduce whatever is happening on the site (https://www.screencast.com/t/aEhZvtZS) whenever it's on the production environment.

@alvarotrigo
Copy link
Owner

I can't seem to reproduce whatever is happening on the site (https://www.screencast.com/t/aEhZvtZS) whenever it's on the production environment.

The whole purpose of the isolated reproduction is trying to reproduce the issue :)
Without an isolated reproduction it will be difficult for me to check it out.

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

No branches or pull requests

2 participants