An infinite type and delete animation in Angular 10

An angular 10 component for infinite type and delete animation

Demo

• Stackblitz

Installation

1. run this:

   npm i ngx-sbz-type-delete

2. go to app.module and add this:

   import { InfiniteTypeDeleteModule } from "ngx-sbz-type-delete";
      
   @NgModule({
       imports: [
           InfiniteTypeDeleteModule
       ]
   })

3. use like this:

    <ngx-sbz-type-delete [wordArray]="['hello']"></ngx-sbz-type-delete>

4.. Enjoy :)

Inputs to customize to animation

| Input | Type | Default | Description | | ----------------------- | -------- | ----------- | ---------------------------------------------------------------- | | wordArray | string[] | ----------- | array of strings to be displayed on screen | | textColor | string | 'black' | text and blink color | | fontSize | string | '20px' | size of the text. suffix must be px/vw/vh | | blinkWidth | string | '2px' | width of the blinking cursor at the end. suffix must be px/vw/vh | | typingSpeedMilliseconds | number | 300 | delay between each letter typing. 1000 milliseconds => 1 second | | deleteSpeedMilliseconds | number | 300 | delay between each letter delete. 1000 milliseconds => 1 second |

Contribution

Want to contribute? Great! It's open source.

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Added some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new Pull Request

License

• You can find the license here: License