Text Highlighting & Typing Effects In jQuery - typeLighter.js

typeLighter.js is a jQuery plugin which lets you create an infinite-looping text rotator with text highlighting, typing and deleting effects.

How to use it:

1. Include the minified version of the jQuery typeLighter.js plugin after jQuery JavaScript library and we're ready to go.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="typelighter.min.js"></script>

2. Define your comma separated text strings in the 'data-wordlist' attribute as follows:

jQueryScript.Net: 
<span data-wordlist="Lorem ipsum dolor sit amet, Sed luctus non nunc vitae efficitur, Cras tempor tempor est in tincidunt, Aenean eu auctor risus, a tempor diam">
  Lorem ipsum dolor sit amet
</span>.

3. Enable the text rotator with default settings.

$('span').typeLighter();

4. Style the highlighted text

.typelighted {
  background-color: yellow;
  color: #000;
  /* any other styling */
}

5. Config the text rotator by overriding the default settings values as displayed below:

$('span').typeLighter({

  // highlighting speed
  highlightSpeed: 25,

  // typing speed
  typeSpeed: 100,

  // deleting speed
  clearDelay: 350,

  // tuping speed
  typeDelay: 200,

  // default attribute
  attribute: 'data-wordlist',

  //additional class(es)
  class: null,

  // interval
  interval: 2500,

  // initial delay
  initialDelay: 0,
  
});

---

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