jQuery Say

Have you ever wanted to animate text like this? Well now you can with jquery-say!

Add your own custom CSS to the `text-character` and `text-character hidden` classes for more effects.

Hook into callbacks on each character, at the end of a sentence, at the end of an element, and whenever the whole animation completes.

Le usage:

$(function(){ $('p').say({ // default: 50; Time between each character delay: 50 // default: 800; Time between each element , elementJumpDelay: 800 // default: 500; Time between each sentence , endOfSentenceDelay: 500 // default .?!; Character denoting sentence end , endOfSentenceChar: [ '.', '?', '!' ] // Called when the entire sequence is complete , onComplete: function(){} // Called when an element is complete , onEndOfElement: function( $prev, $curr ){} // Called when a sentence is complete , onEndOfSentence: function( $el ){} // Called for each character processed , onChar: function( character, $el ){} }); });

Installation:

bower install jquery-say -- Or with jam jam install jquery-say

View the source of this page to see how the effects are done.

Browser Support: