Vue-scroll-toggle-class

Scroll Toogle Class component using Vue.js.

Installation

$ yarn add vue-scroll-toggle-class
# or 
$ npm i --save vue-scroll-toggle-class

Global Registration

Register the component

import { VueScrollToggleClass } from 'vue-scroll-toggle-class';
 
Vue.component('vue-scroll-toggle-class', VueScrollToggleClass);

Install the plugin

import VueScrollToggleClass from 'vue-scroll-toggle-class';
 
Vue.use(VueScrollToggleClass);

Usage

<template>
  <vue-scroll-toggle-class
    repeat="on"
    position="top"
  >
    <div>Example</div>
  </vue-scroll-toggle-class>
</template>

Local Registration

Usage

<template>
  <vue-scroll-toggle-class
    repeat="on"
    position="top"
  >
    <div>Example</div>
  </vue-scroll-toggle-class>
</template>
 
<script>
import { VueScrollToggleClass } from "vue-scroll-toggle-class";
export default {
  components: {
    VueScrollToggleClass
  }
}
</script>

SSR

Create the plugins/vue-scroll-toggle-class.js :

import Vue from 'vue'
import VueScrollToggleClass from 'vue-scroll-toggle-class'
 
Vue.component('vue-scroll-toggle-class', VueScrollToggleClass)

Include plugin in your nuxt.config.js file:

module.exports = {
  plugins: ['~plugins/vue-scroll-toggle-class']
}

Props

Prop	Data Type	Required	Default	Description
repeat	String	false	off	repeat toggle class
position	String	true		toggle class position

Contributing

Welcome to improve vue-scroll-toggle-class with any issue, pull request or code review.

# Setup 
$ cd vue-scroll-toggle-class
$ npm install
 
# dev-server 
$ npm run serve
 
# Build 
$ npm run build:lib
 
# Unit Testing 
$ npm run test:unit
 
# Lint 
$ npm run lint
# Lint - fix 
$ npm run lint --fix

License

MIT