liScroll (a jQuery News Ticker made easy) 1.0

Last updated tuesday, march 30 2010

What's this? liScroll is a jQuery plugin that transforms any given unordered list into a scrolling News Ticker

jquery.li-scroller.1.0.js

10/10/2007The first thing that most Javascript programmers
10/10/2007End up doing is adding some code
10/10/2007The code that you want to run
08/10/2007Inside of which is the code that you want to run
08/10/2007Right when the page is loaded
05/10/2007Problematically, however, the Javascript code
04/10/2007The first thing that most Javascript programmers
04/10/2007End up doing is adding some code
04/10/2007The code that you want to run
03/10/2007Inside of which is the code that you want to run
03/10/2007Right when the page is loaded
01/10/2007Problematically, however, the Javascript code

The markup


<ul id="ticker01">
	<li><span>10/10/2007</span><a href="#">The first thing ...</a></li>
	<li><span>10/10/2007</span><a href="#">End up doing is ...</a></li>
	<li><span>10/10/2007</span><a href="#">The code that you ...</a></li>
	<!-- eccetera -->
</ul>

To build your news ticker all you need is the above markup: an unordered list with a unique ID

10/10/2007The first thing that most Javascript programmers
10/10/2007End up doing is adding some code
10/10/2007The code that you want to run
08/10/2007Inside of which is the code that you want to run
08/10/2007Right when the page is loaded

Ready? liScroll()

Once you're done with your markup, simply call liScroll() like that:


$(function(){
	$("ul#ticker01").liScroll();
});

If you want your list to scroll faster or slower than the default value, modify the travelocity param


$(function(){
	$("ul#ticker02").liScroll({travelocity: 0.15});
});

... and enjoy!

2007 - 2009 Gian Carlo Mingati - Design and development for interactive media