smooth-scrollbar-vue

Smooth scrollbar for Vue.js projects

Usage no npm install needed!

<script type="module">
  import smoothScrollbarVue from 'https://cdn.skypack.dev/smooth-scrollbar-vue';
</script>

README

Vue Smooth Scrollbar

Smooth Scrollbar for Vue.js projects. Based on @idiotwu's smooth-scrollbar.

Usage

1. Install dependency

npm install --save smooth-scrollbar-vue

2. Import component into main.js

// src/main.js
import Vue from 'vue'
...
import SmoothScrollbar from 'smooth-scrollbar-vue'
Vue.use(SmoothScrollbar)
...

3. Use component in your templates

<template>
  <div id="scroll-area">
    <smooth-scrollbar>
      <div id="example-content"></div>
    </smooth-scrollbar>
  </div>
</template>

<style>
  #scroll-area {
    width: 500px;
    height: 500px;
  }

  #example-content {
    width: 2000px;
    height: 2000px;
  }
</style>

Backlog

  • Plugin structure
  • Basic implementation
  • Options
  • Events
  • Methods
  • Styling
  • Build dist
  • SSR / nuxt