A customizable Go to Top button for React
npm install react-gototop-button
A highly customizable "Go to Top" button for React applications, designed to enhance user experience by providing a smooth and convenient way to scroll back to the top of the page.
Easy Integration: Quickly add a "Go to Top" button to your React application with minimal setup.
Fully Customizable: Customize the button's background color, text color, size, position, padding, border radius, and more to match your application's design.
Smooth Scrolling: Smooth scroll back to the top of the page with a single click, enhancing the user experience.
Visibility Control: Specify the scroll position at which the button should appear, ensuring it only shows when needed.
Hover Effects: Add hover effects to the button for an interactive and engaging UI element.
Responsive Design: The button is designed to be fully responsive, ensuring it looks great on all devices.
You can install the package using npm or yarn:
```
npm install react-gototop-button
or
``
yarn add react-gototop-button
Here's an example of how to use the GoToTopButton component in your React application:
`
import React from 'react';
import GoToTopButton from 'react-gototop-button';
const App = () => (
Scroll down to see the button...
export default App;
`
| Prop | Type | Default | Description |
|------------------|----------|---------------|-----------------------------------------------------------|
| \backgroundColor\| \string\ | \'blue'\ | Background color of the button |color\
| \ | \string\ | \'white'\ | Text color of the button |padding\
| \ | \string\ | \'10px'\ | Padding inside the button |position\
| \ | \string\ | \'bottom-right'\| Position of the button (\'bottom-right'\, \'bottom-left'\, \'top-right'\, \'top-left'\) |size\
| \ | \string\ | \'50px'\ | Width and height of the button |showAt\
| \ | \number\ | \100\ | Scroll position (in pixels) at which the button appears |borderRadius\
| \ | \string\ | \'10px'\ | Border radius of the button |children\
| \ | \node\ | \'â'\` | Content of the button |
- Developed by Varad Patil
- Inspired by various "go to top" button implementations across the web.