vue-good-links
An easy to use link/text hover effect library for VueJS 
Live Demo
If you endup using and liking vue-good-links, consider spreading the joy :)
Follow the project progress live
Installing
Install with npm:
npm install --save vue-good-links Usage
import directly into components:
<template> <div> this is my <vgl-swing text="fancy text"></vgl-swing> </div> </template> <script> import {VglSwing} from 'vue-good-links'; export default { components: { 'vgl-swing': VglSwing, }, }; </script>or use globally
import VueGoodLinks from 'vue-good-links'; // import the styles import 'vue-good-links/dist/vue-good-links.css'; Vue.use(VueGoodLinks);List of Effects
- VglWave
- VglRollup
- VglSlidein
- VglGhost
- VglSwing
- VglRotate
Component Options
| Option | Description | Type, Example |
|---|---|---|
| originalSpanStyle | css styles for standing text span. (applies to all but VglWave) | <vgl-swing :originalSpanStyle="{color: 'blue'}" text="fancy!"></vgl-swing> |
| hoverSpanStyle | css styles for hovering text span. (applies to all but VglWave) | <vgl-swing :hoverSpanStyle="{color: 'blue'}" text="fancy!"></vgl-swing> |
License
This project is licensed under the MIT License - see the LICENSE.md file for details
inspiration for effects taken from Tympanus
