Breaking News: Grepper is joining You.com. Read the official announcement!

react scroll in up when click element

Danish Pk answered on August 6, 2022 Popularity 9/10 Helpfulness 6/10

answer react scroll in up when click element

related react scroll down on click

react scroll in up when click element

Comment

import {useRef} from 'react';

export default function App() {
  const ref = useRef(null);

  const handleClick = () => {
    ref.current?.scrollIntoView({behavior: 'smooth'});
  };

  return (
    <div>
      <button onClick={handleClick}>Scroll to element</button>

      <div style={{height: '155rem'}} />

      <div ref={ref}>Some content here</div>

      <div style={{height: '155rem'}} />
    </div>
  );
}

Popularity 9/10 Helpfulness 6/10 Language javascript

Source: bobbyhadz.com

Tags: click element javascript react-scroll when

Link to this answer
Share Copy Link

Contributed on Aug 06 2022

Danish Pk

0 Answers Avg Quality 2/10

Closely Related Answers

react scroll down on click

Comment

import React, { useRef } from 'react';

const ScrollDownButton = () => {
  const sectionRef = useRef(null);

  const handleScrollDown = () => {
    sectionRef.current.scrollIntoView({ behavior: 'smooth' });
  };

  return (
    <>
      <button onClick={handleScrollDown}>Scroll Down</button>
      {/* ... */}
      {/* Content */}
      {/* ... */}
      <section ref={sectionRef}>
        {/* ... */}
        {/* Scroll to this section on button click */}
        {/* ... */}
      </section>
    </>
  );
};

export default ScrollDownButton;

Popularity 7/10 Helpfulness 1/10 Language

Source: Grepper

Link to this answer
Share Copy Link

Contributed on Sep 12 2023

YOU.com

0 Answers Avg Quality 2/10

react scroll in up when click element

Contents

More Related Answers

react scroll in up when click element

Closely Related Answers

react scroll down on click

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.