Skip to content

ScrollTo didn't work for me! #73

Open
@yunkhngn

Description

@yunkhngn

I think the scrollTo button didn't work for me.
You can check why it doesn't work on my site: Example

image

This is how I wrote the component, same as the documentation code you have given:

import React from 'react'
import {Button, Div, scrollTo} from 'atomize'
import Notfound from '../Notfound/Notfound'

const Playground = () => {
  // if (process.env.NODE_ENV === 'production') {
    
  //   return <Notfound/> 
  // }
  // else{
  return (
    <Div>
      <Div h="100vh" bg="blue100" d="flex" align="center" justify="center">
        <Button
            id="blueButton"
            onClick={() => scrollTo("#yellowButton")}
            bg="info700"
          >
            Scroll To Yellow Button
        </Button>
      </Div>
      <Div h="100vh" bg="blue100" d="flex" align="center" justify="center">
        <Button
            id="yellowButton"
            onClick={() => scrollTo("#blueButton", 100, 0, 800)}
            bg="warning700"
          >
            Scroll To Blue Button
        </Button>
      </Div>
    </Div>
  )
}
// }
export default Playground

I'm using react-router-dom, and routed components, so I think it's the leading cause. I want to make a scroll to the top button. I tried using window.scrollTop(0,0) but still not working (the button does nothing, no error caused).

Thanks for your help. Glad to get a response from you.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions