react-router-hash-link icon indicating copy to clipboard operation
react-router-hash-link copied to clipboard

Routing works, but scroll bar remains static

Open alexnbuchanan opened this issue 2 years ago • 1 comments

I added a HashLink, which (when I click "Projects" in my navbar) is to scroll to a section of my home page with an id of "projects". It works, the page is smooth scrolling to the correct section.

However, I'm noticing that my scroll bar isn't changing, and remains static. This is causing the section of my home page above the id to be cut off. Here is a video to demonstrate, notice the scroll bar doesn't change when I active the HashLink by clicking "Projects".

Is there a way I can correct this issue? My NavBar currently looks like this:

import React from "react";
import "./Nav.css";
import { HashLink } from "react-router-hash-link";

export default function Nav() {
  return (
    <div>
      <ul>
        <li>
          <a href="#">About</a>
        </li>
        <li>
          <HashLink smooth to="/#projects">
            Projects
          </HashLink>
        </li>
      </ul>
    </div>
  );
}

alexnbuchanan avatar Aug 18 '22 06:08 alexnbuchanan

hey did you get any fix, cus I am also getting same issue

anuragrootandleaves avatar Jun 12 '23 12:06 anuragrootandleaves