Stack Overflow
Stack Overflow

Questions tagged [react-scroll]

76 questions
1
vote
0 answers

react-scroll navigate and scroll to anchor from any page

I'm using react-scroll to scroll from the Nav to any preset anchor element. I chose it because it also provides an active class to the Nav items when element is in viewport. This exmple works if i'm on the HomePage. But if i click the navbar item…
Cristian Muscalu
  • 9,007
  • 12
  • 44
  • 76
1
vote
1 answer

Jump to sequential tags by one button

I have the following source code(React.js, React-scroll, React-bootstrap). Click the div, Jump to specific image tag.(In this example, jump to first image.) render(){ return( …
Kaw
  • 13
  • 3
0
votes
0 answers

On scroll nav sticks to the top 0 and doesn't come to its original position

I'm currently working on implementing the active functionality for tabs using react-scroll. Here's how it will work: I will import this functionality into the Campaign page. When the user scrolls and the window reaches the top (position 0), the…
sohaib
  • 574
  • 5
  • 16
0
votes
1 answer

How do I position my component to not be under my NavBar while using react-scroll?

I am using react-scroll to smoothly scroll through four components. When I click one of the components from the NavBar, it scrolls the component to the top of the screen, rather than the bottom of the NavBar. I added an image to show how the NavBar…
user21075278
  • 3
  • 2
0
votes
0 answers

testing react-scroll - "Seems containerElement is not an ancestor of the Element"

I am working on a browser based react app, and have a problem that occurs in test code but not in the browser. I have a requirement to scroll to an element within a scrollable div. The project I'm working on already uses react-scroll, and…
Chris
  • 1,644
  • 1
  • 11
  • 15
0
votes
1 answer

My react app doesn't load on IOS ,Is there any specific react library that would prevent the page from loading on IOS devices?

I'm having trouble launching m website on IOS devices only.The link opens in Android phones and web browsers normally but when it comes to IOS devices it doesn't load anything and a white page appears. This is the site…
mo yehia
  • 1
  • 3
0
votes
0 answers

How to implement react-scroll with Material UI that uses props/mapping the navbar items?

I wanted to implement react scroll on my Material UI project. I cannot seem to make it work, I tried following youtube videos but no one seemed to use with MUI or incorporate it with props, also tried to look at the documentation but I have not…
MeL17
  • 31
  • 4
0
votes
0 answers

Window is not defined error when using "react-hide-on-scroll" package

I am creating a react app where I want to hide the bottom arrow from the hero section over scroll. For that I have installed this "react-hide-on-scroll" package. Now, I am getting window is not defined error. I have tried fixing it using conditional…
Anaya Ammar
  • 9
  • 3
0
votes
0 answers

ReactJS Navigation with ID links to sections on page

I am trying to get a menu to work in React that has id links to the specific id div on the homepage, and then other separate pages. If I am on the actual home page, I have the links working as in click scroll down to section on page and highlight…
Nicole Lambon
  • 1
  • 3
0
votes
0 answers

React smooth scroll throw error saying target Element not found

I am building my single-page portfolio website which has a few sections having full-screen height with their own component. import React, { useRef, useEffect } from "react"; import { Element } from "react-scroll"; import Contact from…
nehat khan
  • 69
  • 5
0
votes
1 answer

Change navbar active class on click and scroll using React

I was trying to do a floating sticky nav bar in React using simple HTML and CSS and some JS. Clicking on the button will take me to the page but it won't change the navbar active class sometimes and also i want the nav bar active class to change as…
Grim Reaper
  • 3
  • 2
0
votes
0 answers

react-scrollspy-nav causes error after deploying react app

I want to active menu on scroll in my react app. I have used a react-scrollspy-nav for this functionality. It works fine when i run it on local server but when i deploy so it shows a blank screen i have used a react-scrollspy-nav in my app, which…
Bilal Hassan
  • 1
0
votes
0 answers

React: Customise react-scroll behaviour

As per the react-scroll readme, we have to pass in to="target" props to help in tracking the element and also to navigate to the element when clicked. We have a use-case where we need to make the link active some pixels before the element reaches…
plffy
  • 21
  • 3
0
votes
0 answers

My tag from react-scroll seems to have no destination, but it is passed to it in code

I am trying to make a smooth transition to my second panel of the page by making anchor, as I read on the internet the proper way to do this is by using react.scroll but after doing everything like on the internet my tag simply don't work, while…
Paul
  • 1
0
votes
2 answers

Using both react-router-dom and react-scroll

I'm trying to make a simple navbar, where some of the links link to sections in the same component(page), using react scroll and then have other links link to a different component(route page). Hope the makes sense? Here is a simple version:…
Jonas Bjørn Pedersen
  • 35
  • 6
1 2
3
4 5