Get new jQuery plugins just once a week

×

t-js

FavoriteLoadingAdd to favorites

October 30, 2014

t-js | jQuery plugin for Typewriter effect

t-js is a jQuery plugin to create a nice Typewrite like effect with support for html.

Example Code :-
$(function(){

$(elem).t([content,]{

/*basic settings*/

speed:75, // typing speed (ms)
speed_vary:false, // 'human-like' (bool)
delay:false, // delays start for (N.)Ns
mistype:false, // mistyping: 1:N per char
locale:'en', // keyboard layout; 'en', 'de'
caret:true, // caret (HTML); default (TRUE): ?
blink:false, // blink; if TRUE, 10ms or N ms
tag:'span', // wrapper (.t-container/.t-caret)
repeat:false, // if TRUE, infinite or N times

/*callbacks*/

init:function(elem){},
typing:function(elem,chars_total,chars_left,char){},
fin:function(elem){}

});

Created by Benjamin Lips

Download

Example

t-js jQuery plguin

type writer

jQuery.Typewriter w/ nice features

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="t.min.js"></script>

$(function(){
$(elem).t([content,]{

//Basic settings
speed:75,          // typing speed (ms)
speed_vary:false,  // 'human-like' (bool)
delay:false,       // delays start for (N.)Ns
mistype:false,     // mistyping: 1:N per char
locale:'en',       // keyboard layout; 'en', 'de'
caret:true,        // caret (HTML); default (TRUE): ▎
blink:false,       // blink; if TRUE, 10ms or N ms
tag:'span',        // wrapper (.t-container/.t-caret)
repeat:false,      // if TRUE, infinite or N times

//Callbacks
init:function(elem){}, 
typing:function(elem,chars_total,chars_left,char){},
fin:function(elem){}

});});

//Methods
$(elem).t('add',content);         // adds content
$(elem).t('pause'[,true/false]);  // pauses typing (toggles if 2nd param omitted)

//Data/properties
$(elem).data('t');                // TRUE if initialised
$(elem).data('is_typing');        // (bool)
$(elem).data('pause');            // (bool)

Let's type

Adding content / pause typing

Del/Ins: Special treatment

Notes

Event-handling

t-js

Related posts:

Typist
TextTailor.js
underline-js

To install using Bower
bower install t.js

t-js jQuery plguin

http://jquer.in/wp-content/uploads/2014/10/t-js.jpg

jQuery plugin

Sign up for our weekly newsletter.

* We won't spam you ever