Window scrolls to top onClick

I am using links for Previous/Next of PDF pages.

The functionality works great (pages go previous/next as expected). However, my viewport/window scrolls to the top anytime the onClick link is clicked. Would appreciate any advice on how to prevent the page window from scrolling. Thanks!

<a onClick={pageNumber <= 1 ? "event.stopPropagation()" : previousPage}>&larr; Previous</a>

references:

    function previousPage() {
        changePage(-1);
    }

    function nextPage() {
        changePage(1);
    }

Thanks in advance. One of my absolute favorite React projects!

[kubami]

The same thing happened to me. But it only happened when I navigated to a page that hasn’t been displayed before in this session. When changing to a page that was already displayed it did not scroll to the top.

React will scroll viewport to the top when components change dimensions on the page. The solution was to set width or height on the CSS class of the container Document. (not to be confused with the width or height of the Page)

[hdehal]

As a heads-up, a combination of CSS and the methods in these threads worked for me: https://github.com/wojtekmaj/react-pdf/issues/418 https://github.com/wojtekmaj/react-pdf/issues/689

.react-pdf__Page.prevPage {
  position: absolute !important;
  z-index: 1;
}

.react-pdf__Document{
  height: 80px;
}

Thanks!