# vuescroll

> A powerful, customizable, multi-mode scrollbar plugin based on Vue.js

Latest version **4.18.1** (published 2023-10-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install vuescroll
pnpm add vuescroll
yarn add vuescroll
bun add vuescroll
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 4.18.1 |
| Published | 2023-10-08 |
| First published | 2017-12-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 768.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Yves Wang |
| Maintainers | wangyi7099 |
| Keywords | vuescroll, scrollbar, vuescrollbar, vue |

## Links

- npm: https://www.npmjs.com/package/vuescroll
- Repository: https://github.com/YvesCoding/vuescroll
- Homepage: https://github.com/YvesCoding/vuescroll#readme
- Issues: https://github.com/YvesCoding/vuescroll/issues
- npm.io page: https://npm.io/package/vuescroll

## Alternatives

- [@sentry/react-native](https://npm.io/package/@sentry/react-native.md) — 2.6M weekly downloads
- [@ardatan/aggregate-error](https://npm.io/package/@ardatan/aggregate-error.md) — 708.1K weekly downloads
- [custom-error-generator](https://npm.io/package/custom-error-generator.md) — 2.0K weekly downloads
- [@technik-sde/prosemirror-recreate-transform](https://npm.io/package/@technik-sde/prosemirror-recreate-transform.md) — 1.5K weekly downloads
- [@suchipi/error-utils](https://npm.io/package/@suchipi/error-utils.md) — 78 weekly downloads

## Recent versions

- 4.18.1 (latest) — 2023-10-08
- 4.9.7-rc.2 (next) — 2019-01-22
- 5.1.1 — 2023-06-19
- 4.18.0 — 2023-06-19
- 5.1.0 — 2023-06-19
- 4.17.6 — 2023-04-09
- 5.0.2 — 2023-04-09
- 4.17.5 — 2022-07-30
- 5.0.1 — 2022-07-30
- 5.0.0 — 2022-07-08
- 4.17.4 — 2022-06-29
- 4.17.3 — 2021-01-06
- 4.17.2 — 2020-12-14
- 4.17.1 — 2020-12-10
- 4.17.0 — 2020-12-05
- … 276 more at https://npm.io/package/vuescroll/versions

## README

<p align="center"><a href="http://vuescrolljs.yvescoding.me/"><img width="100" src="http://vuescrolljs.yvescoding.me/logo.png" /></a></p>
<h1 align="center">Vuescroll</h1>
<p align="center">
  <a href="https://www.npmjs.com/package/vuescroll"><img src="https://img.shields.io/npm/v/vuescroll.svg" alt="Version"></a><a href="https://circleci.com/gh/YvesCoding/vuescroll/tree/dev"><img src="https://circleci.com/gh/YvesCoding/vuescroll/tree/dev.png?style=shield" alt="Build Status"></a>
   <a href="https://codecov.io/github/YvesCoding/vuescroll?branch=dev"><img src="https://img.shields.io/codecov/c/github/YvesCoding/vuescroll/dev.svg" alt="Coverage"></a>
  <a href="https://www.npmjs.com/package/vuescroll"><img src="https://img.shields.io/npm/l/vuescroll.svg" alt="License"></a>
<a href="https://www.npmjs.com/package/vuescroll"><img src="https://img.shields.io/npm/dm/vuescroll.svg" alt="Download"></a>
<a href="https://github.com/YvesCoding/vuescroll"><img src="https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square" alt="prettier"></a>
</p>

<p align="center">
  <img src="https://github.com/wangyi7099/pictureCdn/blob/master/allPic/vuescroll/show.gif?raw=true" width="800"  alt="Demo"/> 
</p>
 
## Introduction

Vuescroll is a scrollbar plugin based on Vue.js 2.X, it is very easy to use, no complex options and each option has its default value(It means you don't even have to write any configuration). Just wrap the content by `<vue-scroll>` and a custom scrollbar will show. It supports:

- Customizable scrollbar
- Pull-to-refresh, push-to-load
- Carousel

_Vuescroll's compatibility is the same as `Vue.js 2.X`._

## Demo

- You can find demo under examples folder of repo.
- You can see the full features of vuescroll at [Live Demo](https://vuescrolljs.yvescoding.me/demo) section of the website.

## Install

```bash
npm i vuescroll -S

# OR

yarn add vuescroll

```

## Usage

### Import and registry

```js
import vuescroll from 'vuescroll';
import Vue from 'vue';

Vue.use(vuescroll);

// OR

Vue.component('vue-scroll', vuescroll);
```

### Wrap the content by vue-scroll

```html
<div class="container">
  <vue-scroll>
    <div class="content"></div>
  </vue-scroll>
</div>
```

## Documentation

For detailed docs, please see [Guide](https://vuescrolljs.yvescoding.me/guide) section on the website.

## Communication

- Wechat

 <img src="https://github.com/wangyi7099/pictureCdn/blob/master/allPic/vuescroll/wx.png?raw=true" width="400" alt="Demo" style="max-width:100%;">

- Twitter

[@wangyi70991](https://twitter.com/wangyi70991)

## License

**MIT** By Yves Wang(Wangyi Yi)

---
_Source: https://npm.io/package/vuescroll · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._