Vue-waving-text NPM

vue-waving-text

Component to display waving text for Vue.

Demo

Installation

Bundler (Webpack, Rollup...)

yarn add vue-waving-text

npm install --save vue-waving-text

Register

Global

import WavingText from 'vue-waving-text';

Vue.component('WavingText', WavingText);

Local

import WavingText from 'vue-waving-text';

Vue.extend({
  template: '...',
  components: {
    WavingText: WavingText
  }
});

Browser

Download vue and vue-waving-text or use a CDN like unpkg.

<script src="vue.js"></script>
<script src="vue-waving-text.umd.js"></script>
or
<script src="https://unpkg.com/vue-waving-text/dist/vue-waving-text.umd.js"></script>

Usage

With all props.

<WavingText
    text="Vue waving text!"
    duration="1.1"
    side="30"
    fontsize="56"
    textClass="myClass"
    fromcolor="white"
    tocolor="#95b0ad"
/>

Setup

Props

Parameter	Type	Default	Description
text (required)	`String`	-	Text that waves.
duration	`String`	`0.3`	Duration of animation in sec.
side	`String`	`90`	translateY axis pixel value.
fontsize	`String`	`50`	Fony size.
fromcolor	`white`	`50`	Animation of text color, start value. Any vaild css color.
tocolor	`black`	`50`	Animation of text color, end value.Any vaild css color.
textClass	`String`	-	Class that apply to font.

License

The MIT License

vue

@infinitebrahmanuniverse/nolb-vue-w @everything-registry/sub-chunk-3096

0.3.0

7 years ago

0.2.0

7 years ago

0.1.0

7 years ago