0.0.20 • Published 3 years ago

reveal-animations v0.0.20

Weekly downloads
-
License
-
Repository
-
Last release
3 years ago

vue-accordion

Vue directive for reveal animations based on Intersection Observer.

Installation

npm i vue-reveal-animations

or

yarn add npm i vue-reveal-animations

Then you can install your plugin globally with

...
import revealAnimations from 'vue-reveal-animations'

Vue.directive('reveal-animations', revealAnimations)
...

or locally

...
import revealAnimations from 'vue-reveal-animations'

export default {
  ...
  directives: {
    revealAnimations
  },
  ...
}
...

Usage

Use as directive with object props as bind.

<div v-reveal-animations="options">
  ...
</div>

Options

ParameterRequiredTypeDefaultDescription
typeString'fade-in'Animation type. Available animations: 'fade-in', 'slide-in', 'custom'. If type is 'custom' you have to set initialState and finalState as an object of css properties.
offsetNumber0.5Intersection observer offset
targetDOM Node || CSS Selectorcurrent elementTarget of animation
durationNumber1.2Duration of animation
easeString'expo.out'Type of ease. Based on GSAP Eases documentation > https://greensock.com/docs/v3/Eases
0.0.20

3 years ago

0.0.19

3 years ago

0.0.18

3 years ago

0.0.17

3 years ago

0.0.16

3 years ago

0.0.15

3 years ago