Awesome Open Source
Awesome Open Source

VBar

The virtual responsive crossbrowser scrollbar component for VueJS 2x

DEMO

Usage

Install

Using NPM
npm i v-bar
Using yarn
yarn add v-bar

In your .vue component create a class to your wrapper

Using SASS
<style lang="sass">
    .wrapper
        height: 300px
        width: 300px
</style>
Simple CSS
<style>
    .wrapper {
        height: 300px;
        width: 300px;
    }
</style>

Include the component in your template

Using Simple HTML
<template>
    <v-bar wrapper="wrapper"
        vBar=""
        vBarInternal=""
        hBar=""
        hBarInternal="">
        <!-- your content -->
    </v-bar>
</template>

Import component

<script>
    import VBar from 'v-bar'

    # Declare
    export default {
        components: { VBar }
    }
</script>

Options

VBar is fully customizable. You can use your CSS classes to make it even more beautiful :)

*required* wrapper=""
*optional* vBar=""
*optional* vBarInternal=""
*optional* hBar=""
*optional* hBarInternal=""

To contribute and make it better

Clone the repo, change what you want and send PR

Contributions are always welcome!

Build Setup

# install dependencies
# using NPM
npm install

# using yarn
yarn

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

Contributors

Luigui Delyer

https://github.com/luiguild

Carlo Fragni

https://github.com/carlofragni

SoullessWaffle

https://github.com/SoullessWaffle

Robbe Clerckx

https://github.com/robbeman

antshil

https://github.com/antshil

Henrique Deodato

https://github.com/h3nr1ke


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (69,571
vue (4,186
vuejs (1,099
component (565
sass (463
vuejs2 (374
vue2 (267
vue-components (193
scroll (108
scrolling (90
pug (89
scrollbar (31