jQuery Animate Overflow Plugin

Download on GitHub

Overview

Animate Overflow is a simple plugin I designed to emulate an MP3 Player's display. It allows you to display an arbitrary length of data in a single line of fixed width, with no added markup.

Demos

PingPong Demo Linear Demo
This is short
This is loooooooooooooooooooooooooooooooong
This is short
This is loooooooooooooooooooooooooooooooong

Usage

In the minimal setup, all you need to do is include the plugin after your call to jQuery, choose a block-level element or group of elements, and apply the animation like so:

$('.elements').animateOverflow();

To take advantage of all the settings, the call would look more like:

$('.elements').animateOverflow(
    animation: 'pingpong', // options are 'pingpong' and 'linear'.  default is 'pingpong'
    step_speed : 30,       // sets time between each animation step, in milliseconds.  default is 30.
    delay      : 600,      // sets delay between each loop of the animation, in milliseconds.  default is 600.
    divider    : ' | '     // sets divider string used between loops of linear animation.  default is ' | '
);
            


©2013 - Gregory J Schoppe - http://gschoppe.com