jQuery Text Carousel
As part of my research at the University of Southampton, I worked on a demonstrator that found trending images on Twitter from their content. As part of this demonstrator, we had a visualisation that showed the tweets which used the images. For this I wrote a jQuery plugin that displayed text as a slide carousel.
Here's an example showing a set of quotes.
The size of the wrapper above has been fixed to avoid the page bobbing up and down.
require jQuery and the jQuery widget factory, but the code also uses
jquery.timers (for its animation).
Create an element in the page and then apply the text carousel widget to it, just as you would with any jQuery widget:
To add text to the carousel, use the
addText method. This takes three parameters:
the text itself, a title and a date. Actually, the title and date are just strings so you can use
them for any information. When I was using them for tweets, I used the title for the user identifier
of the tweeter and the date for the date and time of the tweet.
$('#tc').textCarousel( 'addText', "text", "title", "date" );
You can call
addText as many times as you like and the text will be appended to the
list of items in the carousel. If you need to reset the list, there's a method
which will empty the carousel.
The code is released under the MIT license, which basically means you can do whatever you like except pretend it's yours.