Wondering what’s next for npm?Check out our public roadmap! »

    tinytyper

    0.1.0 • Public • Published

    ⌨️ TinyTyper - a tiny library for creating a typing effect on specified text element.

    JavaScript Style Guide Build Status Dependency Status

    Demo

    Size (It's really tiny)

    • Minimized: 2.9KB
    • Gziped: 1.1KB

    Installation

    Library can be easily installed via either NPM or Bower:

    npm i tinytyper --save

    OR

    bower i tinytyper --save

    Usage

    Basic setup looks like this:

    import TinyTyper from 'tinytyper';
     
    const el       = document.querySelector('.text-el')
    const options  = { /* . . . */ }
    const instance = new TinyTyper(el, options)

    In case you need to run animation again:

    instance.animate()

    Available options:

    Option Default Description
    text innerText of specifed element Sets a text to be displayed
    textSpeed 95 Defines of text speed animation
    cursor ▌ Defines current cursor symbol
    blinkSpeed 0.05 Defines blink speed of a cursor
    cursorClass tiny-typer-cursor A CSS class for cursor element
    textClass tiny-typer-text A CSS class for text element
    staticCursor false Makes cursor static (disables blinking)
    staticText false Makes text static (disables animation)

    Contributions

    Contributions are welcome. Feel free to create issues and PRs

    Install

    npm i tinytyper

    DownloadsWeekly Downloads

    15

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • avatar
    • avatar