jQuery Plugin To Simulate Terminal Text Effects - t.js

jQuery Plugin To Simulate Terminal Text Effects - t.js
File Size: 14.1 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

t.js is a lightweight, programmable jQuery plugin to print any text with configurable typing and erasing effects just like you type something in a terminal.

How to use it:

1. Just place the JavaScript file t.js after jQuery library and you're ready to go.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/t.min.js"></script>

2. The JavaScript to print out text from inline html. You're able to add delete/insert/delay/wait effects using semantic markups as follows:

<div id="t">
  Hello world. Let's wait <del>hundred</del>two seconds ..<ins>2</ins><br/><br/>
  <strong>Thanks for waiting.</strong> Now, t.js will detect a
  <del>regular</del>'special' char which triggers the function <mark>foo()</mark>.
  *<ins>2</ins><ins> &larr; Yay, FTW!!</ins>
</div>
$('#t').t();

3. Or define your text message in the JavaScript as this:

$('#t').t('text to print');

4. All possible configuration options and callback functions.

$('#t').t({

  // typing speed in milliseconds
  speed:75, 

  // enable 'human-like'
  speed_vary:false, 

  // delays start
  delay:false, 

  // mistyping
  mistype:false,

  // en or de
  locale:'en',

  // enable caret
  caret:true, 

  // enable blink
  blink:false,  

  // permanent caret blinking
  blink_perm:true,

  // wrapper tag
  tag:'span',

  // pauses/continues typing on click/tap
  pause_on_click:false, 

  // infinite or N times
  repeat:false, 

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

});

5. API methods.

// add new content
$("#t").t('add',content);

// pause typing
$("#t").t('pause'[,true/false]);

// queued type processing
$("#t").t('queue',content)
$("#t").q(content)

// destroy
$("#t").t('off'[,true/false]);

Changelog:

2019-04-08

  • v1.5.5:. t_off() fixed

2019-03-18

  • v1.5.4: added queued type processing ($(elm).t('queue',content) / $(elm).q(content))

2018-12-14

  • v1.5.3: added t_off([true]) method to destroy typer's instance

2018-12-11

  • v1.5.1: added typing-speed-change at runtime: <s> / $(elm).s(ms)

2018-09-13

  • v1.3.1

2018-09-10

  • v1.2

2018-03-03

  • v1.1

2018-02-22

2017-06-06

  • v0.9

This awesome jQuery plugin is developed by mntn-dev. For more Advanced Usages, please check the demo page or visit the official website.