YvesCoding / vuescroll

A customizable scrollbar plugin based on vue.js for PC , mobile phone, touch screen, laptop.
https://nifty-shannon-7eab38.netlify.app/
MIT License
1.27k stars 111 forks source link
component javascript scrollbar slide virtual-scrollbar vue vue-components vuescroll

Vuescroll

VersionBuild Status Coverage License Download prettier

Demo

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:

Compatibility

vue version vuescroll version
2.x <=4.X
3.x >=5.0.0

Demo

Install

npm i vuescroll -S

# OR

yarn add vuescroll

Usage

Import and registry

For vue2.x

import vuescroll from 'vuescroll';
import Vue from 'vue';

Vue.use(vuescroll, {
  ops: {
    // The global config
  },
  name: 'myScroll' // customize component name, default -> vueScroll
});

// OR

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

For vue3.x

import { createApp } from 'vue';
import vuescroll from 'vuescroll';

const app = createApp(App);

// You can set global config here.
app.use(vuescroll, {
  ops: {
    // The global config
  },
  name: 'myScroll' // customize component name, default -> vueScroll
});

Wrap the content by vue-scroll

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

Documentation

For detailed docs, please see Guide section on the website.

Communication

@wangyi70991

License

MIT By Yves Wang(Wangyi Yi)