https://github.com/ctf0/vue-stagger
vue v2 Staggering-List-Transitions
https://github.com/ctf0/vue-stagger
Last synced: about 1 year ago
JSON representation
vue v2 Staggering-List-Transitions
- Host: GitHub
- URL: https://github.com/ctf0/vue-stagger
- Owner: ctf0
- License: mit
- Created: 2018-08-16T16:38:39.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2023-01-03T23:00:52.000Z (over 3 years ago)
- Last Synced: 2024-10-11T12:18:33.333Z (over 1 year ago)
- Language: Vue
- Homepage:
- Size: 7.81 KB
- Stars: 3
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
Vue Stagger
## Installation
```bash
npm install vue-stagger --save
```
## Usage
- register the component.
```js
window.Vue = require('vue')
Vue.component('TransitionStagger', require('vue-stagger'))
```
- now use it like
```html
// your data
```
| prop | required | type | default | description |
|-------------------|--------------------|---------|---------|--------------------------------------------------|
| tag | :x: | string | ul | |
| delay | :white_check_mark: | number | | in milliseconds |
| beforeEnterStyles | :white_check_mark: | object | | [props][velo] |
| enterStyles | :white_check_mark: | object | | [props][velo] |
| leaveStyles | :white_check_mark: | object | | [props][velo] |
| options | :x: | object | {} | extra velocity [options][opt] |
| enterAtOnce | :x: | boolean | false | show all items at once "dont delay the entering" |
| leaveAtOnce | :x: | boolean | false | hide all items at once "dont delay the leaving" |
[velo]: http://velocityjs.org/#cssSupport
[opt]: http://velocityjs.org/