Gatsby: Page change scrolling not working

Created on 10 Jan 2017  Â·  9Comments  Â·  Source: gatsbyjs/gatsby

The page scroll does not work when I change pages. It should automatically get built in to react-router when I run gatsby build right?

Most helpful comment

Same issue here. Scrolling doesn't go to top after pushing a new route to browser history.

All 9 comments

It only works if you use the back button not when you click directly on a link. Is that perhaps the problem?

Gotcha yeah. Well even if I click the back button, it won't work. I started with this kit: https://github.com/gatsbyjs/gatsby-starter-documentation

What are you expecting to happen?

On Mon, Jan 9, 2017 at 10:27 PM Vincent Ning notifications@github.com
wrote:

Gotcha yeah. Well even if I click the back button, it won't work. I
started with this kit:
https://github.com/gatsbyjs/gatsby-starter-documentation

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/631#issuecomment-271497009,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAEVh4RMlfzPmf2efXHQTkQU67Ie1Znjks5rQyTEgaJpZM4LfBCJ
.

When I click on a link that uses from react-router, for it to auto-scroll up to the top of the destination page.

hmmm... that should be working. Can't think of a reason atm why it wouldn't
be working...

On Mon, Jan 9, 2017 at 10:40 PM Vincent Ning notifications@github.com
wrote:

When I click on a link that uses from react-router, for it to auto-scroll
up to the top of the destination page.

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/631#issuecomment-271498685,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAEVh8d3zvxLeswkIRAGGBfizBdZNeC6ks5rQyfVgaJpZM4LfBCJ
.

Same issue here. Scrolling doesn't go to top after pushing a new route to browser history.

Auto scroll up not working for me as well, can anyone think of a reason why, or where is it implemented in gatsby code.

I just ran into this and it was simply due this html, body { height: 100%; }

Luckily my layout was not dependent on it.

Hope that helps someone!

Closing this out as it's a bit old. If people are still having trouble — would love to see an issue with suggestions on how we can improve our implementation.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

theduke picture theduke  Â·  3Comments

totsteps picture totsteps  Â·  3Comments

jimfilippou picture jimfilippou  Â·  3Comments

brandonmp picture brandonmp  Â·  3Comments

3CordGuy picture 3CordGuy  Â·  3Comments