8 useful text effect plugins for jQuery

jQuery typography and text effect plugins will give you more control to precisely position and re-size each letter of your web typography in order to make websites more beautiful and appealing. 

Text animation is a preferred way to highlight the text and catch attention of users. These text effects as jQuery plugins are tiny, easy to use, lightweight and support various form of animations. 

1. Textillate.js

Textillate.js allows you to animate text with effects such as flash, bounce, shake and more. It combines two powerful JavaScript libraries, animate. css and lettering. js with a simple API for CSS3 animations.  It divides the animation into two components, in and out animation. It will require animate.css and textillate.js as dependencies before it is ready for use. 

2. Fontflex

This is a Lightweight jQuery extension for dynamically changing font size according to container/browser width. It is mainly intended for use with responsive or adaptive CSS layouts.

3. CurvedText

To get unique text effects with jQuery plugins, you need to understand all different options available. CurvedText plugin enables you to arrange each letter of your text along a curved path. Based on CSS3 transitions and transforms, the plugin has the ability to rotate letters to create curved text on any curve like an arc, circle, ellipse, and others. 

4. jQuery Burn

jQuery Burn is a text effect plugin using text-shadow, animated by repeatedly changing their horizontal offsets, which allows you to add flame-like effect to text on your web page. It can be stopped and restarted dynamically, colored, stretched, offset, sped up and slowed down. The flame motion is simulated with a simple wave equation solution. 

5. Readmore.js

This super simple and lightweight jQuery plugin automatically generates a Read More link for users to click and read the rest of the content. There is no need for complicated sets of div’s or hardcoded classes, just call .readmore() on the element containing your block of text and Readmore.js takes care of the rest. Readmore plays well in a responsive environment, too.

6. FitText

FitText is a jQuery plugin that can make font-sizes flexible on your fluid or responsive layout. For instance, you can use the plugin to achieve scalable headlines that fill the width of a parent element.

7. Slab Text

For producing big, bold & responsive headline text effects, perfect jQuery plugins like Slab Text are available. Slab Text splits headlines into rows before resizing each row to fill the available horizontal space.

The ideal number of characters to set on each row is calculated by dividing the available width by the pixel font size – the script then uses this ideal character count to split the headline into word combinations that are displayed as separate rows of text.

8. Morphext

A jQuery plugin for creating text-based carousels, rotating small or large pieces of text one after the other, just like a slider does with images. This can be a great tool for displaying catch phrases, mission statements, tag lines, and so on.