This Library is part of the NGXUI ecosystem.
View all available components at https://ngxui.com
@omnedia/ngx-word-morph
is an Angular library designed to facilitate word morphing animations within Angular applications.
- Morph words within your Angular application.
- Easily customizable.
Install the library using npm:
npm install @omnedia/ngx-word-morph
Import the NgxWordMorphComponent
in your Angular module:
import {NgxWordMorphComponent} from '@omnedia/ngx-word-morph';
@Component({
...
imports:
[
...
NgxWordMorphComponent,
],
...
})
Use the component in your template:
<om-word-morph [words]="['Hello', 'World']" styleClass="custom-class"></om-word-morph>
<om-word-morph
[words]="words"
[morphDuration]="morphDuration"
[morphDelay]="morphDelay"
styleClass="your-custom-class"
></om-word-morph>
Starts the word morphing effect.
words
: An array of strings to be animated.morphDuration
: (optional): The duration of the morphing animation in milliseconds. Default is 1000.morphDelay
: (optional): The delay between morphing one word to the next in milliseconds. Default is 5000.styleClass
: (optional): Add a class to the<div>
wrapper tag.
If you want to style the text, do it globally via the styleClass
.
To change the font size make sure to change the --om-word-morph-font-size
variable instead of directly changing the size.
Contributions are welcome. Please submit a pull request or open an issue to discuss your ideas.
This project is licensed under the MIT License.