Stack Overflow
Stack Overflow

Questions tagged [react-scroll]

76 questions
0
votes
1 answer

How to animate a button from middle of the screen to bottom of the screen

I have implemented a floating button(TouchableOpacity)in react native. I was able to show and hide the button as per the scrolling position. Instead of showing and hiding i want to move button completely out of the screen(bottom) when the scrollview…
Madhu
  • 869
  • 1
  • 17
  • 37
0
votes
1 answer

react-scroll does not work in Electron app

Why animateScroll from react-scroll package doesn't work in my electron App? ScrollBounce set to true for BrowserWindow, here the component import { css, cx } from "emotion"; import { animateScroll } from "react-scroll"; import { ChatModel, }…
Michael B.
  • 23
  • 4
0
votes
2 answers

React body scroll lock issue on IOS

I'm literally fighting in finding a clean solution to the scroll issue in the IOS devices. In my App.js i've simply the background body and a modal with some contents. When the modal is shown i'd like to block the scroll in the background…
Tony
  • 1
  • 3
0
votes
1 answer

How to navigate to an element from another page?

How can I navigate to an element from another page? I've tried this approach with react-scroll --> import { Link } from "react-scroll"; const RightNav = ({ open, page }) => { return ( <>
  • {page !==…
Guibrother32
  • 33
  • 5
0
votes
1 answer

react-scroll scrollToBottom not working when scroll to x does work

I am using react-scroll npm package from here: https://www.npmjs.com/package/react-scroll Following their example, I have set up my code and I can get the onClick functions to work for scrolling a specific distance but the scrollToBottom still does…
Caleb
  • 439
  • 8
  • 29
0
votes
1 answer

How to scroll to specific location on button click in react?

I'm making a website using react and I want a button to scroll to footer section of my website. I am using react-scroll and it is working. I am also using material ui to style my button using their Button component. This is my code…
Deep Parekh
  • 123
  • 1
  • 7
0
votes
1 answer

What is the best way to implement horizontal scroll on list in reactJS? And also can i use getElementById in react code?

I have to implement horizontal scroll for the list of items but with the back and forward arrow button. Following is what i implemented but i want to know if there is another best way to do it may be by using REFS. const scrollLeft = () => { …
Irfan Pathan
  • 309
  • 1
  • 3
  • 14
0
votes
2 answers

Unable to disable smooth scrolling in react-scroll scrollToTop

I am using the react-scroll library in order to handle scrolling on my React app. I want to scroll to the top whenever a specific button is clicked, however I do not want it to scroll smoothly, which seems to be enabled by default. I have tried the…
Sal
  • 1,471
  • 2
  • 15
  • 36
0
votes
0 answers

Smooth scrolling stutters with react-scroll when setting state

I am building a React app that utilizes react-scroll on the home page. I have a series of div elements that span the entire viewport (height: 100vh; width: 100vw) that I am scrolling between, with navigation arrows that you can click to scroll…
Sal
  • 1,471
  • 2
  • 15
  • 36
0
votes
1 answer

React-Scroll duration doesn't apply on Firefox but it works on Chrome

I am building a website which uses the react-scroll library, and am using the Link component in order to activate certain transitions. I am using the duration property, and it works perfectly on Chrome, however when I test the website on Firefox,…
Sal
  • 1,471
  • 2
  • 15
  • 36
-1
votes
1 answer

Module not found: Can't resolve 'react-scroll-horizontal'

this error is showing - npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: landing_page@0.1.0 npm ERR! Found: react@18.2.0 npm ERR! node_modules/react npm ERR! react@"18.2.0" from the root…
Rajneesh Kumar
  • 1
  • 2
-1
votes
1 answer

Typescript not recognizing HTML property

I'm using TypeScript in my Vite React project. I'm having problems to build my project because of this error, says that the name property doesn't exist. Someone know how I can fix that? Type '{ children: Element; name: string; className: string; }'…
Carlos Curcino
  • 49
  • 3
-1
votes
1 answer

we can used react-router-dom and rect-scroll/module at same time in react.js? if yes then how to used?

import React from 'react' import "./Navbar.css" import { Link } from 'react-scroll/modules'; import { Link } from "react-router-dom"; In my project I need to use react-scroll and react-router-dom at time in react app but import { Link } from…
Pratik Vyavahare
  • 23
  • 2
  • 6
-1
votes
1 answer

Wanting to make an arrow animation to expand or collapse the link's sublinks list ReactJS

First time the function executes correctly, when clicking on button all times afterwards - no. I think it gets terminated somewhere. I think that in some of the checkpoints the value for some reason is null, and maybe that is why it isn;t executing,…
Lorasia Andrikanych
  • 78
  • 8
-2
votes
1 answer

Mapped data not being read by react-scroll

On this Image, you can see I made some data to be passed on. NavbarData.js And i passed it by using the .map function and populate it on the to={} property Navbar.js Im getting this error "Uncaught TypeError: Cannot read properties of undefined…
PAUL
  • 85
  • 8
1 2 3 4
5