https://github.com/bre97-web/scroll-button

适用于任意框架的滚动按钮，一次点击滚动到底。可选择滚动方向和速度。
https://github.com/bre97-web/scroll-button

Last synced: about 2 months ago
JSON representation

适用于任意框架的滚动按钮，一次点击滚动到底。可选择滚动方向和速度。

• Host: GitHub
• URL: https://github.com/bre97-web/scroll-button
• Owner: bre97-web
• License: mit
• Created: 2023-07-09T05:09:03.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-08-13T02:22:21.000Z (over 1 year ago)
• Last Synced: 2024-10-18T16:30:00.647Z (3 months ago)
• Language: TypeScript
• Homepage: https://bre97-web.github.io/scroll-button/
• Size: 11 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# scroll-button

A lit web component. A Web Component for any framework, this component does not provide any style and structure. Please provide the structure inside the scroll-button tag. Provides the function of scrolling up and down to the bottom.

**It's Web Component, work with any framkework, like react, vue, non-framkework.**

See [examples](https://bre97-web.github.io/scroll-button/).

# Quick Start

## Install

```

npm i scroll-button

```

## Import

import from **index.html**

```html

```

or import from main.**js**

```js

import '/scroll-button/scroll-button.js'

```

(**Recommmand**)

or import from main.**ts**

```ts

import '/scroll-button/scroll-button'

```

## Usage

Using it is as easy as using html, You can go to this site to see [examples](https://bre97-web.github.io/scroll-button/)

```html



    




    Go Top

```

# Documents

|Property|Type|Default|Document|

|:--|:-|:--|--:|

|direction|'start' \| 'top' \| 'end' \| 'bottom' \| 'bot'|'start'|The direction of scrolling, start and top represent upward, end and bottom and bot represent downward. On some frameworks the default value may not work and a direction needs to be specified|

|speed|number|1|The speed of scrolling, usually you will prefer to set the parameter to 4 or 8, so that it will scroll faster|

|step|number|0.5|step represents the step size, which is the distance scrolled each time|

|parent|string|document.documentElement|It represents a container with scroll bars|