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