Skip to content

sespiros/typed-text

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

<typed-text>

Polymer 2.0 element that simulates typing similar to typed.js for jQuery.

Check out the demo and full documentation

Install

bower install --save sespiros/typed-text

Install with bower or download the zip

Import

<link rel="import" href="/bower_components/typed-text/typed-text.html">

Usage

<typed-text options></typed-text>

where options can be any of:

  • strings: an array of strings to be typed one after the other i.e. ["Hello world!", "typed-text is awesome"]
  • cursor: specify a cursor string. | by default
  • noretype: only backspaces to erase the part of the string that is different
  • noloop: stops typing after the last string
  • noblink: stops the cursor from blinking

Strings

The typed-text strings can be set in one of two ways:

  • Using the strings property:
<typed-text strings='["Hello world", "Another sentence"]'></typed-text>
  • Writing directly into the HTML element:
  <typed-text>
    <p>Here is the first sentence.</p> 
    <p>Here is another one!</p>
  </typed-text>

Cursor

<typed-text cursor="|"></typed-text>

Features

  • Can type and delete text
  • Supports constant looping between text
  • Cursor blinking and customization with custom-style
  • Smart noretype to keep common parts of consecutive strings
  • Style it however you want for cool effects!

Contribute

Feel free to extend it or propose new functionality

About

Polymer 2.0 element that simulates typing

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •  

Languages