Best jQuery Text Effect Plugins & Tutorials with Demo

    Glorious Demo : Easiest way to Demonstrate your Code

    Glorious Demo : Easiest way to Demonstrate your Code

    Glorious Demo is the easiest way to demonstrate your code in action.

    Splitting.js : JavaScript library to Split an element by Words & Characters

    Splitting.js : JavaScript library to Split an element by Words & Characters

    Splitting.js is a JavaScript microlibrary designed to split (section off) an element in a variety of ways, such as words, characters, child nodes, and more!

    Most Splitting methods utilize a series of <span>s populated with CSS variables and data attributes unlocking transitions and animations that were previously not feasible with CSS.

    LuminJS : JavaScript library to Progressively Highlight Any Text

    LuminJS : JavaScript library to Progressively Highlight Any Text

    LuminJS is a JavaScript library to progressively highlight any text on a page.Great for when you want users to pay attention to some important text.
    It can also be used to show progress of a task − Read something while tasks are being completed.

    t.js : jQuery Hypertext Typewriter Plugin

    t.js : jQuery Hypertext Typewriter Plugin

    t.js is a lightweight jQuery hypertext typewriter plugin.

    T-Writer.js : JavaScript Native Typewriter Effect

    T-Writer.js : JavaScript Native Typewriter Effect

    T-Writer.js is a JavaScript native typewriter effect, without compromises or dependencies.

    Creating a custom typewriter effect can be cumbersome and time consuming. However, most of the libraries out there are either slow, bloated with dependencies, or lacking in functionality.

    T-Writer.js was designed to provide maximum flexibility and usability, while remaining fast and dependency free.

    Rotator : jQuery plugin for Rotating Text & Words with CSS3

    Rotator : jQuery plugin for Rotating Text & Words with CSS3

    Rotator is a lightweight and customizable jQuery plugin for rotating text and some words of your text with awesome CSS3 animations.

    Splitting : JavaScript microlibrary to Split an element by Words & Characters

    Splitting : JavaScript microlibrary to Split an element by Words & Characters

    Splitting is a JavaScript microlibrary to split an element by words, characters, children and more, populated with CSS variables!

    Most Splitting methods utilize a series of <span>s populated with CSS variables and data attributes unlocking transitions and animations that were previously not feasible with CSS.

    liike.js : Tiny JavaScript Tweening Library

    liike.js : Tiny JavaScript Tweening Library

    Liike is a Finnish word and means movementmotion. It’s a minimalistic library to create performant custom JS tweens no matter what you’re tweening.

    When you create a tween, Liike will create a single render loop on-demand for every tweens running and use DOMHighResTimeStamp (provided by requestAnimationFrame), which should be accurate to 5 µs. If the delay is 0, Liike will start the tween at the next animation frame and count the duration from there.

    Ideas for Proximity Feedback with Progressive Hover Effects

    Ideas for Proximity Feedback with Progressive Hover Effects

    Today we’d like to share some subtle proximity feedback ideas with you. We’re exploring a progressive hover effect which triggers not just when we are hovering an element but progressively, when we come close to it. There are several interesting use cases for this kind of effect and today we wanted to showcase some of them.

    Fitty : Snugly Resizes Text to fit its Parent Container

    Fitty : Snugly Resizes Text to fit its Parent Container

    Scales up (or down) text so it fits perfectly to its parent container.Ideal for flexible and responsive websites.

    Features:

    • No dependencies
    • Easy setup
    • Optimal performance by grouping DOM read and write operations
    • Works with WebFonts (see example below)
    • Min and max font sizes
    • Support for MultiLine
    • Auto update when viewport changes
    • Monitors element subtree and updates accordingly