react-fullpage icon indicating copy to clipboard operation
react-fullpage copied to clipboard
verified publisher icon alvarotrigo

Not ending up on the first section after Next.js page transition

Open gustavlrsn opened this issue 3 years ago • 9 comments

Description

Hello! I recently upgraded to v4 when I noticed this issue, the bug is not in v3.

I have multiple pages in Next.js with different fullpage sections, when doing a page transition I'm not always ending up on the first section.

https://user-images.githubusercontent.com/1552194/168397655-5cb7a63b-3103-4372-8e43-aaced4cd0651.mov

Reproduction

https://codesandbox.io/s/react-fullpage-page-transition-bug-5qre5d?file=/components/fullpage.js (might need to open a new terminal and run yarn start and open a new browser in :3001, seems to be some issue with CodeSandbox)

Steps to reproduce it

  1. Click down the sections until you get to the last section
  2. Click link to the second page
  3. See that you end up on section number 2 and not the first one

Versions

Chrome, Mac OS

gustavlrsn avatar May 13 '22 22:05 gustavlrsn

Thanks for reporting it! I'll investigate it.

alvarotrigo avatar May 17 '22 17:05 alvarotrigo

Was this ever fixed? I am still having issues.

dev-lukian avatar Jul 16 '22 20:07 dev-lukian

Not yet.

alvarotrigo avatar Jul 18 '22 05:07 alvarotrigo

@alvarotrigo Are there plans of fixing this soon? I am about to launch a project and this is a bug that is refraining me from doing so.

dev-lukian avatar Jul 18 '22 14:07 dev-lukian

No plan. I might need external help to figure this out, as I'm not heavy on React or Next :)

alvarotrigo avatar Jul 18 '22 17:07 alvarotrigo

Hi, any estimate on when it will be resolved? This issue is currently blocking us from upgrading to v4, which we really would like to do as it's much smoother.

skoteskote avatar Aug 12 '22 10:08 skoteskote

@skoteskote I've just tested it again and I can not reproduce the issue anymore here: https://codesandbox.io/s/react-fullpage-page-transition-bug-5qre5d?file=/components/fullpage.js

Can you verify you still have the issue?

It might have been solved when updating the React wrapper to the latest fullPagejs version?

alvarotrigo avatar Aug 12 '22 10:08 alvarotrigo

I fixed this issue by adding fullpage_api.silentMoveTo(1) right after I switch to another page.

dev-lukian avatar Aug 17 '22 19:08 dev-lukian

Issue still exists. I was trying to do it with fullpage_api.moveTo(1) but was facing #405. @dev-lukian thanks for this.

Point to be noted that it works fine if ReactFullpage is only the thing being rendered on the screen. However, I also have a Header (position: fixed, zIndex: 10000), which breaks this. which shouldn't happen.

devAdrish avatar Mar 22 '23 10:03 devAdrish