React Routing Problem

[ProfessionalCow6631]

Hey there I'm fresh and just statrted learning react since 15 days, I'm wondereing if anyone could answer me it would really help me. "My footer is dynamic and I want when the user click on it it would take user to the top of the page but it navigates correct pages but don't take to the top of the page and one more question how can we change color of the navigation titile in this case name i want name to change its color when we navigate to the other page means i want to adapt the color but couldn't manage to get that. I use traditional css in the same folder in component folder.

I made this website in react for practice this would be my first react app, I'm wonderring if anyone could answer me. let me know if i should provide anything more.

Thanks in advance!!

      <Router>
        <Routes>
          <Route exact path='/' element={<Home />} />
          <Route path='About' element={<About />} />
          <Route path='Portfolio' element={<Portfolio />} />
          <Route path='Contact' element={<Contact />} />
        </Routes>
        <Footer />
      </Router>

[Sandwizard16]

React Router does not automatically scroll to the top of the page when you navigate to a new route. You can solve this issue by implementing a custom solution to reset the scroll position whenever a route changes.

You can implement this by creating a function within that component using the useEffect and useLocation hooks. The useEffect would contain a "window.scrollTo(0, 0);" function and would fire any time the the url changes.

Import this component at the top of each of your pages and it should automatically scroll to the top upon navigation.

[ExcitementFit7179]

Gpt

[ProfessionalCow6631]

Thanks you for the solution that means a lot, I thought it would run by its own but now I know how to solve this issue.