type-writer-xs

1.1.10 • Public • Published

Angular Typewriter made with typescript language.

Installation

npm i type-writer-xs

Example usage

import { TypeWriterXsComponent } from 'type-writer-xs';

@Component({
  selector: 'your-component',
  template: `
    <div class="whitespace"></div>
  `,
  styles: []
})

export default function InsideYourComponent() {

    //TypeWriterXsComponent -> (HTMLElement, loop = false (default), typeSpeed = 50 (default), DeleteSpeed = 50 (default))
    //Note All speeds in milliseconds.
    const writer = new TypeWriterXsComponent(document.querySelector(".whitespace") as HTMLDivElement ,true, 130, 150);

    writer.typeString('hello there').typeString(' its type writer ').typeString(' Made by XeNDeR ').pauseFor(2000).deleteUpto(12).typeString(' visit : www.ixender.com').deleteAll().typeString('Bye').deleteAll().start();
}

Inside Details

Name Type Description Required Default
userInput string Text to display as string true
loop boolean Set to true if the typewriter should loop after finishing typing the string(s) true false
typeSpeed number How long (in ms) does the the typewriter wait after typing one character true 50ms
deleteSpeed number How long (in ms) does the the typewriter wait after deleting one character true 50ms
typeString(userInput: string) function() It will start the typing animation
pauseFor(duration: number) function() It will start pause the typing animation upto "duration"
deleteUpto(chars : number) function() It will delete upto "chars" given by user.
deleteAll() function() It will delete complete text.

Package Sidebar

Install

npm i type-writer-xs

Weekly Downloads

2

Version

1.1.10

License

ISC

Unpacked Size

658 kB

Total Files

22

Last publish

Collaborators

  • xender